0

I've done this before, but I'm having trouble getting this to work...

I need the following jquery to have a .stopPropagation function, so the animation won't go crazy if the user hovers over three elements too quickly!

    $(function () {
            var tabContainers = $('div.subMenu > div');
            tabContainers.hide();

            $('.mainMenuDiv a').hover(
            function (e) {
                tabContainers.filter(this.hash).slideDown();
                e.stop();
            },
            function(e){
                tabContainers.filter(this.hash).slideUp();
                e.stopPropagation();
            });
    });
4

4 に答える 4

4

stop不完全なアニメーションをキャンセルする機能を探しているようです。

$('.mainMenuDiv a').hover(
    function (e) {
        tabContainers.filter(this.hash).stop().slideDown();
    },
    function(e){
        tabContainers.filter(this.hash).stop().slideUp();
    }
);

または、進行中のアニメーションを「ロールバック」したい場合は、次を試してください。

$('.mainMenuDiv a').hover(
    function (e) {
        tabContainers.filter(this.hash).stop(true, true).slideDown();
    },
    function(e){
        tabContainers.filter(this.hash).stop(true, true).slideUp();
    }
);

詳細については、ドキュメントをご覧ください。

于 2009-09-28T20:58:34.240 に答える
2

stopPropagation() と stopImmediatePropagation() を同じものであるかのように使用する場合は注意してください。

  • Event.stopPropagation() メソッドは、イベント オブジェクトが次のノードに移動するのを防ぎますが、それは現在のノードの他のイベント リスナーの実行が許可された後でのみです。

  • Event.stopImmediatePropagation() メソッドも、イベント オブジェクトが次のノードに移動するのを防ぎますが、現在のノードの他のイベント リスナーの実行を許可しません。

于 2011-06-28T20:50:43.587 に答える
0 
$(function () {

        var tabContainers = $('div.subMenu > div');
        tabContainers.hide();

        $('.mainMenuDiv a').hover(function () {

            tabContainers.filter(this.hash).dequeue().slideDown();

        },function () {

            tabContainers.filter(this.hash).dequeue().slideUp();

        });

});

これがお役に立てば幸いです。;）イベントは子要素からそのすべての親に「バブルアップ」しevent.stopPropragation();ますevent.stopImmediatePropagation()。ただし、アニメーションを停止するにはdequeue()。

于 2009-09-28T20:52:34.720 に答える
0

私は間違っているかもしれませんが、これはうまくいくかもしれません：

$(function () {
    var tabContainers = $('div.subMenu > div');
    tabContainers.hide();
    $('.mainMenuDiv a').hover(function() {
        tabContainers.filter(this.hash).stop().slideDown();
    },function() {
        tabContainers.filter(this.hash).stop().slideUp();
    });
});
于 2009-09-28T20:57:33.050 に答える