amaze UI 笔记 - JS】的更多相关文章

导航添加依据 http://amazeui.org/javascript 下面内容属学习笔记,如有理解偏差和错误请留言相告,感谢!* =(官网这块写的很详细) 一 .UI增强 1.警告框 显示可关闭的页内警告信息. 在 Alert 最外层元素上添加 data-am-alert. 2.按钮交互 * a.按钮Loading状态    b.单按钮状态切换    c.复选框 d.单选框 3.折叠面板 4.下拉组件 5.模态窗口 6.弹出框 7.加载进度条 基本使用:调用 start() . done()…
导航添加依据 http://amazeui.org/css/  下面内容属学习笔记,如有理解偏差和错误请留言相告,感谢!* =(官网这块写的很详细) 一.基本样式 1.统一样式 说明了为什么使用Normalize,而不是Rest. 2.基础设置 a.css和模型 讲了一个CSS3的新属性:box-sizing.作为一个技术不到位的人,真没看懂.自己查了下如下: box-sizing的3种属性取一即可 box-sizing:content-box | padding-box | border-bo…
amaze ui各个模块简单说明 导航添加依据 http://amazeui.org/css/  下面内容属学习笔记,如有理解偏差和错误请留言相告,感谢!* =(官网这块写的很详细) 一.基本样式 1.统一样式 说明了为什么使用Normalize,而不是Rest. 2.基础设置 a.css和模型 讲了一个CSS3的新属性:box-sizing.作为一个技术不到位的人,真没看懂.自己查了下如下: box-sizing的3种属性取一即可 box-sizing:content-box | paddin…
1.自定义事件 (1)一些组件提供了自定义事件,命名方式为{事件名称}.{组件名称}.amui,用户可以查看组件文档了解.使用这些事件,如: $('#myAlert').on('close.alert.amui',function(){ //do something; }); (2)data-am-observe 在元素上添加data-am-abserve属性以后,动态插入改元素的Amaze UI JS插件会自动初始化,支持的插件包括Button.Dropdown.Slider.Popover.…
amazeui学习笔记--js插件(UI增强)--警告框Alert 一.总结 1.警告框基本样式:用am-alert声明div容器, <div class="am-alert"> 没什么可给你,但求凭这阙歌.谢谢你风雨里,都不退愿陪着我. </div> 2.警告框关闭按钮:data-am-alert应该是js事件,因为点击后面的关闭按钮真的可以关闭掉 <div class="am-alert" data-am-alert> <…
js插件---图片懒加载echo.js结合 Amaze UI ScrollSpy 使用 一.总结 一句话总结:图片懒加载echo.js结合 Amaze UI ScrollSpy 使用的效果就是:懒加载的基础上面加上了动画效果,比如fade 使用的话简单到爆,倒是没有什么好说. 二.图片懒加载echo.js结合 Amaze UI ScrollSpy 使用 百度盘下载地址: 链接:https://pan.baidu.com/s/1TiZ2u6itIj4q9gVVpwQ5tg 密码:ceko 1.截图…
js插件---Amaze UI dialog如何使用 一.总结 一句话总结:别人给你列出来的参考手册照着用先 1.在哪里去找插件参考资料或者使用手册(一般位置找不到的时候)? github上面啊,非常详细了 2.dialog中如何动态控制弹出框? 方法一:这里可以用将方法赋值给变量的形式,然后再将这个变量show()出来 25 var $actions = AMUI.dialog.actions({ 26 title: '标题啊', 27 items: [ 28 {content: '<a hr…
amazeui学习笔记--js插件(UI增强4)--下拉组件Dropdown 一.总结 1.am-dropdown(及其孩子):控制下拉列表的样式 2.data-am-dropdown(及其孩子):控制下拉列表的事件,这部分事件当然可以用jquery来代替 3.下拉列表样例: <div class="am-dropdown" data-am-dropdown> <button class="am-btn am-btn-primary am-dropdown-…
amazeui学习笔记--js插件(UI增强3)--折叠面板Collapse 一.总结 注意点: 1.data-am-collapse:这个东西就是展开折叠事件 2.am-collapse(包括其下属):这个控制折叠样式 1.折叠面板:结合 Panel 组件实现手风琴效果.需结合以下辅助 class 使用: 要隐藏的内容添加 .am-collapse: 默认显示的内容添加 .am-collapse.am-in: 添加以上 class 以后,通过 Data API 来调用: <h4 data-am…
amazeui学习笔记--js插件(UI增强2)--按钮交互Button 一.总结 1.按钮loading状态: <button type="button" class="am-btn am-btn-primary btn-loading-example">Submit - Button</button> <input type="button" class="am-btn am-btn-primary b…