amazeui 的弹出窗口,比bootstrap的好看_Android, Python及开发编程讨论区_Weblogic技术|Tuxedo技术|中间件技术|Oracle论坛|JAVA论坛|Linux/Unix技术|hadoop论坛_联动北方技术论坛  
网站首页 | 关于我们 | 服务中心 | 经验交流 | 公司荣誉 | 成功案例 | 合作伙伴 | 联系我们 |
联动北方-国内领先的云技术服务提供商
»  游客             当前位置:  论坛首页 »  自由讨论区 »  Android, Python及开发编程讨论区 »
总帖数
3
每页帖数
101/1页1
返回列表
0
发起投票  发起投票 发新帖子
查看: 5793 | 回复: 2   主题: amazeui 的弹出窗口,比bootstrap的好看        下一篇 
java_along
注册用户
等级:上尉
经验:771
发帖:36
精华:0
注册:2014-2-17
状态:离线
发送短消息息给java_along 加好友    发送短消息息给java_along 发消息
发表于: IP:您无权察看 2014-8-26 22:48:23 | [全部帖] [楼主帖] 楼主

在以前介绍了许多关于bootstrap的用法,其中有一种就是弹出框框的

Bootstrap:


效果:

北京联动北方科技有限公司

代码:

<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Launch demo modal
</button>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
amazeUI:


效果:

北京联动北方科技有限公司

代码:

<button class="am-btn am-btn-primary" data-am-modal="{target: '#my-alert'}">Alert</button>
<div class="am-modal am-modal-alert" tabindex="-1" id="my-alert">
<div class="am-modal-dialog">
<div class="am-modal-hd">Amaze UI</div>
<div class="am-modal-bd">
Hello world!
</div>
<div class="am-modal-footer">
<span class="am-modal-btn">确定</span>
<span class="am-modal-btn">取消</span>
</div>
</div>
</div>


虽然2者表达的内容不同,但是展现的2种方式,我还是更倾向于amazeUI,更加好看,弹出效果也比fade来的好。




赞(0)    操作        顶端