前端开发工具—常用插件/控件分享 (陆续更新)

工欲善其事必先利其器,"前端攻城狮"们快选择适合你的利器

前端插件多如牛毛,选择几款各方面都卓越的插件是有必要的,因为自己开发的插件往往不够成熟!本站推荐的前端插件均基于jquery扩展开发,目的确保在浏览器的兼容性上保持一致,推荐如下: 

幻灯片插件(Slider Plugin)

  • bxslider(响应式内容滑动插件)

特色:

1、响应式跨平台设计(pc电脑端、手机移动端、Pad端等)

2、功能参数齐全,可自定义幻灯片的显示效果、页码、控制按钮等

3、支持图片、video视频、html内容等元素

使用方法:

  1. <script src="http://bxslider.com/js/jquery.min.js"></script><!--jquery库--> 
  2. <script src="http://bxslider.com/lib/jquery.bxslider.min.js"></script> 
  3. <link href="http://bxslider.com/lib/jquery.bxslider.css" rel="stylesheet" /> 
  1. <!--幻灯片html结构--> 
  2. <ul class="bxslider"> 
  3.   <li><img src="/images/pic1.jpg" /></li> 
  4.   <li><img src="/images/pic2.jpg" /></li> 
  5.   <li><img src="/images/pic3.jpg" /></li> 
  6.   <li><img src="/images/pic4.jpg" /></li> 
  7. </ul> 
  1. $(document).ready(function(){ 
  2.   $('.bxslider').bxSlider();//初始化bxSlider插件 
  3. }); 

bxslider官网:http://bxslider.com/

 

弹出对话框/锁屏插件(Dialog) 

  • artDialog

特色:

1、兼容性好,支持ie6+

2、支持锁定屏幕(遮罩)、模拟alert和confirm、多窗口弹出、静止定位、支持Ese键关闭对话框、定时关闭、自定义位置、菜单模式、拖动、鼠标调节窗口大小等

artDialog相关参数及使用方法:

http://www.exp99.com/f2e/artdialog.html

 

日期控件(Date Plugin)

  • my97datepicker

特色:

1、多语言支持和自定义皮肤支持

2、强大的日期范围限制功能

3、跨无限级框架显示和自动选择显示位置

4、自定义事件和丰富的API库

5、太强大啦,容我无法一一列出 :)

这款日期控件,相信大家都不陌生,不仅仅前端开发者在用,后端开发者也在用,几乎我们想实现的日期事件它都具备!!

使用方法:

my97datepicker文档地址:http://www.my97.net/dp/demo/index.htm

 

表单美化控件(Beautify the Form)

  • iCheck

特色:

1、在不同浏览器和设备上都有相同的表现 — 包括 桌面和移动设备

2、支持触摸设备 — iOS、Android、BlackBerry、Windows Phone等系统

4、方便定制 — 用HTML 和 CSS 即可为其设置样式 (多套皮肤)

5、体积小巧 — gzip压缩后只有1 kb

6、25 种参数 用来定制复选框(checkbox)和单选按钮(radio button)

7、8 个回调事件 用来监听输入框的状态

8、能够将输入框的状态变化同步回原始输入框中, 支持所有选择器

使用方法:

  1. $('#input').iCheck('check'); 

查看iCheck插件更详尽的使用方法

最新版iCheck下载地址:https://github.com/damirfoy/iCheck/

 

 

相关经验

导读书签
书签初始化中…