1

この関数またはmousemoveイベントを破棄できますか？

jQueryには、頭痛の種となるコードがいくつかあります。私はこのコードをオンラインで見つけ、要素を渡すときにマウスムーブ効果を提供しましたが、彼を離れるときにイベントを補足または削除する方法を知りたいと思いました。

私が持っている例は次のとおりです。

$("#icons").mouseenter(function(e) {
    $(this).find('div').slidemouse();
});

$("#icons").mouseleave(function(e) {
    $(this).find('div').slidemouse('destroy');
});

コードプラグイン：

(function($) {
    $.fn.slidemouse=function(options) {
        var defaults=
            {
            height:'240px',
            widthExpand:true,
            mirror:false,
            mirrorOpacity:.3
        };
        var opts=$.extend(defaults,options);
        var expands=1;
        var galleryWidth=0;
        var self=this;
        self.css('overflow','hidden');
        self.children().css('height',opts.height);
        self.children().children().each(function(index) {
            galleryWidth=galleryWidth+$(this).outerWidth(true)
        }
        );
        if(opts.widthExpand) {
            while(galleryWidth<self.width()) {
                self.children().children(":nth-child("+expands+")").clone().appendTo(self.children());
                galleryWidth=galleryWidth+self.children().children(":nth-child("+expands+")").outerWidth(true);
                expands++
            }
        }
        self.children().css("width",galleryWidth);
        if(opts.mirror) {
            self.clone().insertAfter(self).attr("id","");
            self.next().fadeTo(0,opts.mirrorOpacity)
        }
        if(opts.widthExpand||opts.mirror) {
            $(window).bind("resize",resizeWindow)
        }
        function resizeWindow() {
            if(opts.widthExpand) {
                galleryWidth=0;
                self.children().children().each(function(index) {
                    galleryWidth=galleryWidth+$(this).outerWidth(true)
                });
                while(galleryWidth<self.width()) {
                    self.children().children(":nth-child("+expands+")").clone().appendTo(self.children());
                    galleryWidth=galleryWidth+self.children().children(":nth-child("+expands+")").outerWidth(true);
                    expands++
                }
                self.children().css("width",galleryWidth);
                if(opts.mirror) {
                    self.next().remove();
                    self.clone().insertAfter(self).attr("id","");
                    self.next().fadeTo(0,opts.mirrorOpacity)
                }
            }
        }
        $(this).parent().mousemove(function(e) {
            var x=e.pageX-this.offsetLeft;
            var calc=(self.children().width()-self.width())/self.width();
            var left=x*calc;
            var right=(self.width()-x)*calc;
            self.stop().animate({scrollLeft: left}, 500);
            if(opts.mirror) {
                self.next().stop().animate({scrollLeft: right}, 500);
            }
        })
    }
}
)(jQuery);
4

1 に答える 1

1

このプラグインには、コードで必要な特定のタスクのためのメソッドがありません。イベントをバインド/バインド解除するだけで、プラグインのルーチンが起動しないようにすることができます。必要に応じて、$（this）.unbind（'event'）を使用します。別の方法として、プラグインに破棄フラグを追加して、プラグインのコードを変更することもできます。

var defaults=
        {
        height:'240px',
        widthExpand:true,
        mirror:false,
        mirrorOpacity:.3,
        destroy: false
};

var opts=$.extend(defaults,options);
var self=this;

if(destroy) {

self.stop();
self.children().stop();

}

これで、mouseleaveの新しいオプションを次のように使用できます。

$(this).slidemouse({destroy: true});
于 2012-06-12T19:04:09.953 に答える