jQuery ui 1.7更新小结


Posted in Javascript onAugust 15, 2009

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> 
            <h3><a href="#" href="#">Test 1</a></h3> 
            <div><table height="100px"><tr><td>News</td></tr></table> 
            </div> 
        </li> 
        <li> 
            <h3><a href="#" href="#">Test 2</a></h3> 
            <div><table height="100px"><tr><td>Magazine</td></tr></table> 
            </div> 
        </li> 
        <li> 
            <h3><a href="#" href="#">Test 3</a></h3> 
            <div><table height="100px"><tr><td>Sport</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> 
                <li><a href="#tab-1" href="#tab-1"><span>One</span></a></li> 
                <li><a href="#tab-2" href="#tab-2"><span>two</span></a></li> 
                <li><a href="#tab-3" href="#tab-3"><span>three</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();
Javascript 相关文章推荐
Javascript条件判断使用小技巧总结
Sep 08 Javascript
网页右键ie不支持event.preventDefault和event.returnValue (需要加window)
Feb 22 Javascript
jQuery.validate 常用方法及需要注意的问题
Mar 20 Javascript
Javascript中的Array数组对象详谈
Mar 03 Javascript
javascript操作ul中li的方法
May 14 Javascript
Jquery ajax 同步阻塞引起的UI线程阻塞问题
Nov 17 Javascript
angularJs关于指令的一些冷门属性详解
Oct 24 Javascript
jQuery实现动态添加tr到table的方法
Dec 26 Javascript
Vue.js 2.x之组件的定义和注册图文详解
Jun 19 Javascript
JavaScript函数IIFE使用详解
Oct 21 Javascript
node.js中npm包管理工具用法分析
Feb 14 Javascript
Vue实现移动端拖拽交换位置
Jul 29 Javascript
IE8 下的Js错误HTML Parsing Error...
Aug 14 #Javascript
jQuery 判断页面元素是否存在的代码
Aug 14 #Javascript
JavaScript写的一个DIV 弹出网页对话框
Aug 14 #Javascript
使用JQuery和s3captche实现一个水果名字的验证
Aug 14 #Javascript
img标签中onerror用法
Aug 13 #Javascript
什么是JavaScript
Aug 13 #Javascript
Javascript Global对象
Aug 13 #Javascript
You might like
PHP 学习路线与时间表
2010/02/21 PHP
php接口与接口引用的深入解析
2013/08/09 PHP
解决PhpMyAdmin中导入2M以上大文件限制的方法分享
2014/06/06 PHP
如何使用php实现评委评分器
2015/07/31 PHP
Node.js中的模块机制学习笔记
2014/11/04 Javascript
使用ionic切换页面卡顿的解决方法
2016/12/16 Javascript
Vue.js最佳实践(五招助你成为vuejs大师)
2018/05/04 Javascript
解决bootstrap模态框数据缓存的问题方法
2018/08/10 Javascript
vue中当图片地址无效的时候,显示默认图片的方法
2018/09/18 Javascript
对angularJs中自定义指令replace的属性详解
2018/10/09 Javascript
说说如何在Vue.js中实现数字输入组件的方法
2019/01/08 Javascript
vue项目中引入vue-datepicker插件的详解
2019/05/14 Javascript
[01:10:49]Secret vs VGJ.S 2018国际邀请赛淘汰赛BO3 第二场 8.24
2018/08/25 DOTA
Python转码问题的解决方法
2008/10/07 Python
用Python编写脚本使IE实现代理上网的教程
2015/04/23 Python
使用PyInstaller将Python程序文件转换为可执行程序文件
2016/07/08 Python
Python控制多进程与多线程并发数总结
2016/10/26 Python
python编程实现希尔排序
2017/04/13 Python
django站点管理详解
2017/12/12 Python
用Pycharm实现鼠标滚轮控制字体大小的方法
2019/01/15 Python
python傅里叶变换FFT绘制频谱图
2019/07/19 Python
Django REST Framework序列化外键获取外键的值方法
2019/07/26 Python
Django项目之Elasticsearch搜索引擎的实例
2019/08/21 Python
Python CSS选择器爬取京东网商品信息过程解析
2020/06/01 Python
python中温度单位转换的实例方法
2020/12/27 Python
纯CSS3大转盘抽奖示例代码(响应式、可配置)
2017/01/13 HTML / CSS
英国浴室洗脸盆购物网站:Click Basin
2018/06/08 全球购物
高级运动鞋:GREATS
2019/07/19 全球购物
留学自荐信的技巧
2013/10/17 职场文书
中学劳技课教师的自我评价
2014/02/05 职场文书
顶碗少年教学反思
2014/02/21 职场文书
美容院合作经营协议书
2014/10/10 职场文书
孝老爱亲事迹材料
2014/12/24 职场文书
外国人来华邀请函
2015/01/31 职场文书
Python数据分析入门之数据读取与存储
2021/05/13 Python
vue实现简易音乐播放器
2022/08/14 Vue.js