Jquery插件

 (function ($, window) {
            //设置默认值并用逗号隔开
            var defaults = {
                padding: 20,
                mouseOverColor: '#000000',
                mouseOutColor: '#ffffff'
            };

            function PaddingList(ele, options) {
                this.ele = ele;
                this.options = options;
            }
            PaddingList.prototype = {
                constructor: PaddingList,
                init: function () {
                    this.bindEvent();
                },
                bindEvent: function () {
                    var that = this;
                    console.log(that);
                    console.log(this.ele);
                    this.ele.find('a').hover(function () {
                        $(this).css("color", that.hoverColor);
                        //queue false表示不添加到动画队列中
                        $(this).animate({ paddingLeft: that.animatePadding }, { queue: false, duration: 300 });

                    }, function () {
                        $(this).css("color", "");
                        $(this).animate({ paddingLeft: "0" }, { queue: true, duration: 300 });
                    });;
                }
            }
            //插件开始
            $.fn.paddingList = function (options) {
                //组合参数
                var options = $.extend(defaults, options);
                return new PaddingList($(this), options);
            }
        })(jQuery, window)
    </script>
    <script type="text/javascript">
        $(function () {
            $("#catagory").paddingList({ animatePadding: 30, hoverColor: "Red" }).init();
        });
    </script>

  

posted @ 2016-03-08 23:18  ICupid  阅读(312)  评论(0编辑  收藏  举报