zoukankan      html  css  js  c++  java
  • 常用的Jquery插件介绍

    一、Jquery UI

    JqueryUI是Jquery官方制作的插件,它的功能非常强大,内容涵盖也很广,包括日期选择、颜色选择、Tab标签切换、拖动层、索引排序、弹出对话框层、滑动门效果、进度条等等,而且还支持多种颜色样式和多种滤镜效果。 可以说,只要用了JqueryUI就不怎么需要其他插件了,但是它的缺点也是功能太庞大,有的时候不一个功能需要引用4-5个JS文件,加在会变慢。

    二、jQuery Easing

    jQuery Easing是动画效果扩展插件,它加强了Jquery中动画的效果。 比如slideUp、slideDown、toggle、show、hide等等,还有Animate。 使用起来也比较简单:

    $(element).slideUp({
        duration: 1000,
        easing: method,
        complete: callback
     });
    $(myElement).animate({
        left: 500,
        top: 500
        },'easeOutExpo'
      ); 

    三、bgiframe

    12款常用的Jquery插件介绍 bgiframe[点击放大]

    bgiframe不是一个应用类型的Jquery插件,而是一个修复BUG的Jquery插件。 bgiframe插件修复的是弹出层被下拉菜单遮挡的BUG,虽然这个BUG不是那么严重,但在应用中是十分恼人的。 bgiframe用法很简单,只要在希望不被遮挡的DIV层上加上应用代码即可:

    <script type="text/javascript">
        $(function() {
        $('#box2').bgiframe();
        $('#box3').bgiframe();
        $('.fix-z-index').bgiframe();  });
    </script> 

    四、Jquery.history

    Jquery.history是一款可以帮助我们操作浏览器历史的插件,这里所谓的操作并不是管理历史,而是可以存储应用程序状态的网址和恢复它的状态。

    支持的浏览器: Internet Explorer 6, 7, and 8+ Safari 4 and 5+ Google Chrome 4+

    五、jQuery Metadata

    jQuery Metadata Plugin可以将HTML元素的class属性、random属性、子元素和HTML5的data-属性中的元数据(metadata)提取出来并作为对象返回。 比如

    var data = $('li.someclass').metadata(); //返回metadata数据

    六、jQuery Numberformatter

    jQuery Numberformatter是一款格式化数字的插件,它可以将各类数字格式化,包括支持货币、科学计数法和百分比。比如

    $("#salaryUS").blur(function(){
    var number = $(this).parseNumber({format:"#,###.00", locale:"us"}, false);
    $("#salaryUnformatted").val(number);});

    七、jQuery Cookie

    $.cookie(’name’, ‘value’);
    //设置cookie的值,把name变量的值设为value
    $.cookie(’name’, ‘value’, {expires: 7, path: ‘/’, domain: ‘jquery.com’, secure: true});
    //新建一个cookie 包括有效期 路径 域名等
    $.cookie(’name’, null);
    //删除一个cookie
    八、jQuery JSON

    故名思议,jQuery JSON是操作JSON数据的插件,只要涉及到数据交互传递的时候都会用到JSON字符串,所以它的实用性可想而知。 Jquery JSON里面有几个关键命令:$.toJSON、$.evalJSON、$.secureEvalJSON、$.quoteString。

    var encoded = $.toJSON( thing ); 
    括号里面的thing将被转换成可用的对象

    九、floatbox

    Floatbox是一款对话框弹窗插件,类似于JqueryUI中的Dialog,但它比Dialog的功能更加全面。 在众多Dialog插件中,我最看好这款。因为它的兼容性、API都比较完善,而且还很好的支持了iframe嵌入功能。 最简单的使用方法就是在需要弹窗的元素上添加class="floatbox "即可。

    十、loopedslide

    loopedslide是一款简单的幻灯片插件,它支持与幻灯片对应的圆点按钮,上一个和下一个按钮,以及自动滑动,而且还支持Easing效果,一般都网站幻灯片焦点图切换效果都够用了。 而令我喜欢的一点是它的自定义非常全面、方便:

    $("#slides").slides({
        container: 'container',
        slideClass: slide,
        pagination: 'pagination',
        navButtons: 'nav-buttons', 
        fadeSpeed: 400,
        slideSpeed: 250,
        animateSpeed: 200,
        autoHeight: true,
        padding: 20,
        easing: 'easeOutQuad'
    }); 

    十一、jQuery Tooltip

    jQuery Tooltip是一款悬浮提示标签插件,它可以在鼠标悬浮到指定连接上时出现提示的内容。 这款插件提示信息支持文本、链接、图片等,而且应用简单:

    $('#set1 *').tooltip(); 

    十二、jQuery Password Validation

    Password Validation是密码强度提示插件,可以根据用户输入的密码关键字来判断密码的强度,就像各大网站上密码验证一样,而且使用者还可自己修改CSS来修改强度的显示样式,比较方便实用。

  • 相关阅读:
    getopt for windows
    开源代码学习之Tinyhttpd
    GCC 中的编译器堆栈保护技术
    读《程序员的思维修炼》有感
    main之前初始化流程
    平均速度
    显示图案
    圆的面积和周长
    C#(Winform) Http 发送数据
    Android BaseAdapter的使用
  • 原文地址:https://www.cnblogs.com/JoannaQ/p/2661293.html
Copyright © 2011-2022 走看看