jQuery插件开发

最新推荐文章于 2022-12-23 14:36:25 发布

原创最新推荐文章于 2022-12-23 14:36:25 发布 · 271 阅读

CC 4.0 BY-SA版权

jQuery 插件开发的三种形式：
    1. $.extend()-----------------扩展jQuery
    2. $.fn ----------------------给jQuery添加新的方法
    3. $.widget()-----------------通过jQuery UI的部件工厂方式创建


1.2 相对于3来说是简单的插件开发。
1相对于2过于简单
所以插件开发一般用第二种方式普遍


基本写法：
    ;(function(){

    })()

更好的兼容性：
    ;(function($,window,document){

    })(jQuery,window,document)

*animate（）方法：
<body>
<div id="div1" style="width: 120px;height: 120px;background: green"></div>
<br/>
<button type="button" id="btn1">animate</button>
<button type="button" id="btn2">reset</button>
</body>
<script>
    $(document).ready(function(){
        $('#btn1').click(function () {
            $('#div1').animate({height:"200px"});
        });
        $('#btn2').click(function () {
            $('#div1').animate({height:"120px"});
        });
    });
</script>
animate() 方法执行 CSS 属性集的自定义动画。
该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的，这样就可以创建动画效果。
只有数字值可创建动画（比如 "margin:30px"）。字符串值无法创建动画（比如 "background-color:red"）。