JQuery特效
(4) ........................................................................................................................................................................................................ 80 (5)在链接旁边加一个小图标效果 .................................................................................................................................................... 81 6 jNice ................................................................................................................................................................................................... 81 7. jQuery calculate ................................................................................................................................................................................. 81 8. jQuery select box ............................................................................................................................................................................... 82 9. prettyCheckboxes .............................................................................................................................................................................. 82 10. jGrow ............................................................................................................................................................................................... 82 11. jQuery Form Plugin ......................................................................................................................................................................... 83 12. mcDropdown jQuery Plug-in ........................................................................................................................................................... 83 13. Create A Slider From A Select Box .................................................................................................................................................. 83 14. TextArea Resizer.............................................................................................................................................................................. 84 15. jQuery MultiSelect........................................................................................................................................................................... 84 16. Editable(jQuery Editable Plugin) ..................................................................................................................................................... 84 17. NicejForm ........................................................................................................................................................................................ 85 18. jScrollPane ....................................................................................................................................................................................... 85 19.利用jQuery制作类似skype的按钮效果. ........................................................................................................................................ 85 20.jCheckbox: .......................................................................................................................................................................................... 86 (21)jQuery asmSelect 感谢博览群书 友情提供 ................................................................................................................................ 86 17.游戏类 ......................................................................................................................................................................................................... 86
1.连连看 ................................................................................................................................................................................................... 86 18.代码高亮类 ................................................................................................................................................................................................. 86
1. beautyOfCode (演示地址) ................................................................................................................................................................... 86 2. Chili (演示地址) .................................................................................................................................................................................. 87 3. Highlight plugin (演示地址) ................................................................................................................................................................ 87
丁丁编程技术 Email:greenvc@gmail.com http://www.kmdin.com 第 5 页,共 97 页
JQuery特效
1.导航类
(1)Horizontal accordion: jQuery
基于jQuery开发,非常简单的水平方向折叠控件。
(2)jQuery-Horizontal Accordion
具有XBOX360 blade界面风格的水平方向Accordion。
(3)jQuery plugin: Accordion
用于创建 折叠菜单的jQuery插件。
(4)Accordion Menu script
基于jQuery开发的可折叠菜单。
丁丁编程技术 Email:greenvc@gmail.com http://www.kmdin.com 第 6 页,共 97 页
JQuery特效
(5)模仿ext的tab选项卡
TabPanel(选项卡组件) 参数说明
renderTo<渲染到某容器string | jQuery object | NULL>
将选项卡组件渲染到某容器,参数类型可以为字符串,也可以为jQuery所加载的对象,如果为声明该参数,组件默认的承载容器为BODY。
items<选项卡元素集合array>
选项卡组件渲染后就会显示的选项卡元素集合,具体参数请查看选项卡元素。 width<宽度string | number>
选项卡组件的总宽度,默认400px。 height<高度string | number>
选项卡组件中页面显示层的高度,默认300px。 border<是否显示边框string>
嵌套显示选项卡时,会出现重复边框的情况,影响美观,将border设置为”none”,则可以避免,默认显示边框,不接受除”none”之外的参数值。
active<渲染后默认激活哪个选项卡元素number> 下标以0为开始,默认为0。
maxLength<最多显示几个选项卡元素number> -1为无限,默认为-1。
tabs<获得选项卡组件所有的选项卡元素return array> 可根据需要获得选项卡组件的所有选项卡元素。 公共方法
addTab(添加一个选项卡元素object) 动态向选项卡组件中添加一个选项卡元素。 flush(刷新选项卡元素的内容string | number)
将选项卡元素的内容刷新,参数可以为选项卡元素的ID或下标。 show(显示选项卡元素string | number)
显示制定选项卡元素,参数可以为选项卡元素的ID或下标。 Kill(关闭选项卡元素string | number)
关闭选项卡元素,参数可以为选项卡元素的ID或下标。 getTabsCount()<获得选项卡元素数量return number>
getTitle(获得选项卡元素的标题string | number)
丁丁编程技术 Email:greenvc@gmail.com http://www.kmdin.com 第 7 页,共 97 页
JQuery特效
getContent(获得选项卡元素的内容string | number)
getCloseable(选项卡元素是否可关闭string | number)
页面引入jQuery.js、TabPanel.js、Fader.js、TabPanel.css new TabPanel({ renderTo:'tabs', width: '100%', height: '500px', active: 0, items: [{ title:'工作中心',
html:'