首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

分享一套相助你优化开发web应用的jQuery插件集 - Vanity Toolset

2012-08-14 
分享一套帮助你优化开发web应用的jQuery插件集 - Vanity Toolset日期:2012-7-10来源:GBin1.com在线演示 本

分享一套帮助你优化开发web应用的jQuery插件集 - Vanity Toolset

日期:2012-7-10  来源:GBin1.com

分享一套相助你优化开发web应用的jQuery插件集 - Vanity Toolset

在线演示 本地下载

jQuery的UI相关插件很多,今天我们介绍来自Vanity Toolset的jQuery插件集,帮助你有效的简化前端UI开发。

这套jQuery UI插件包含了7个不同的UI组件,包括:

jSlider - 幻灯插件jSpotlight - 聚光灯效果插件jPlacehoder - 占位插件jCollapse - 收放插件jTabs - 标签插件jTip - 提示框插件jPaginate  - 分页插件

以上所有的插件都使用很简单的代码,体积非常小,你可以根据自己的需要来完善。文档完善并且拥有非常好的在线演示例子。相信大家使用会非常方便。支持所有的主流浏览器。

如何使用(一个幻灯实现)html代码
<div class="slider"><!-- the elements inside the slider, have as many as you want --><div><a href="#"><img src="images/1.jpg" width="1024" height="350" border="0" /></a></div><div><a href="#"><img src="images/2.jpg" width="1024" height="350" border="0" /></a></div><div><a href="#"><img src="images/3.jpg" width="1024" height="350" border="0" /></a></div><div><a href="#"><img src="images/4.jpg" width="1024" height="350" border="0" /></a></div>    <!-- the navigation can be placed ANYWHERE in your document -->    <a href="#" class="next">&nbsp;</a>    <a href="#" class="prev">&nbsp;</a></div><!-- slider --> 
Javascript
$(document).ready(function(){$(".slider").jSlider({elem:"div",images:true, animation: "random",auto_slide: true, auto_slide_interval:4000, infinite: true, speed: 1200});});
代码非常简单并且直观,希望大家能够应用到自己的项目中去。 

来源:分享一套帮助你优化开发web应用的jQuery插件集 - Vanity Toolset


热点排行