jQuery ui 1.7更新小结

yearfengjian

yearfengjian

2016-02-19 15:09

今天图老师小编给大家介绍下jQuery ui 1.7更新小结,平时喜欢jQuery ui 1.7更新小结的朋友赶紧收藏起来吧!记得点赞哦~
1. 每个ui插件现在都有自己单独的css文件,但是要根据情况与ui.theme.css ui.core.css结合使用,否则有些效果还是显示不出来的。
eg. datepicker就必须同时引用上述两个css文件;accordion 只须引入ui.theme.css即可。这个我会把每个插件独立的demo放在我的资源里边的。
2. ui.accordion
HTML 代码要遵循一定的格式要求:
代码如下:
ul id="example"
li
h3a href="#" href="#"Test 1/a/h3
divtable height="100px"trtdNews/td/tr/table
/div
/li
li
h3a href="#" href="#"Test 2/a/h3
divtable height="100px"trtdMagazine/td/tr/table
/div
/li
li
h3a href="#" href="#"Test 3/a/h3
divtable height="100px"trtdSport/td/tr/table
/div
/li
/ul

必须使用h标签
3. ui.dialog
注意两点:
(1) 在ui -1.7.1 中添加了一个新的引用:jquery.bgiframe.js支持
作用:如果网页上有浮动区块和下拉选单重叠时,在IE6会看到下拉选框总是把浮动区块覆盖住,无论怎么调整 z-index 都是没用的,而用 bgiframe 就可以轻松解决这个问题。
具体参见: http://www.oschina.net/p/bgiframe
使用:
$.ui.dialog.defaults.bgiframe = true;
(2) 如果想实现dialog的拖动效果,必须添加ui.resizable.css 以及ui.resizable.js文件
4. ui.tabs
这个相对ui-1.6 尤其需要注意:
(1) HTML代码规范:
代码如下:
div id="example"
ul
lia href="#tab-1" href="#tab-1"spanOne/span/a/li
lia href="#tab-2" href="#tab-2"spantwo/span/a/li
lia href="#tab-3" href="#tab-3"spanthree/span/a/li
/ul
div id="tab-1"
This is jQuery tab one.
/div
div id="tab-2"
I'm tab two.
/div
div id="tab-3"
Haha, three is here.
/div
div id="new-tab"
This is add tab.
/div
/div

注意: 每个tab相应的div必须放在tab生效的div内。
(2) 不再使用 $("#example ul").tabs();
直接书写为 $("#example").tabs();
展开更多 50%)
分享

猜你喜欢

jQuery ui 1.7更新小结

Web开发
jQuery ui 1.7更新小结

jquery ui 1.7 ui.tabs 动态添加与关闭(按钮关闭+双击关闭)

Web开发
jquery ui 1.7 ui.tabs 动态添加与关闭(按钮关闭+双击关闭)

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

jQuery ui1.7 dialog只能弹出一次问题

Web开发
jQuery ui1.7 dialog只能弹出一次问题

jQuery 技巧小结

Web开发
jQuery 技巧小结

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

JQuery UI皮肤定制

Web开发
JQuery UI皮肤定制

jquery 插件开发方法小结

Web开发
jquery 插件开发方法小结

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

WPS如何添加网格线

WPS如何添加网格线

叩开C#之门系列之C#与面向对象编程语言

叩开C#之门系列之C#与面向对象编程语言
下拉加载更多内容 ↓