傳送帶動畫事件問題

我遇到了一個我已經構建的傳送帶的問題。它具有一個容器內的元素，當點擊具有類moveCarouselRight的按鈕時，這些元素會被可見容器的大小左移。傳送帶動畫事件問題

我的問題是，當用戶點擊太快，即雙擊，動畫似乎火了兩次，這意味着元素沒有正確安裝在容器中，就好像第一「左」的操作沒有完成。

正如你可以看到我試圖用「禁用」標誌解決這個問題，但它似乎從第一個事件的JS已經達到該行代碼之前第二次點擊觸發事件。

var disabled = false; 

$('.moveCarouselRight').on('click', function() { 

if (!disabled) { 

    disabled = true; 

    //change css property 'left' depending on container size 

    disabled = false; 
} 
});

鏈接的jsfiddle：
jsfiddle.net/6TPcT/5

來源

2013-12-09 Ben Taliadoros

幫助你確定你所做的禁用標誌全球 – Pete

禁用的標誌是全球 –

您是否使用了''

使用此：

$(".moveCarouselRight").dblclick(function(event){ 
    event.preventDefault(); 
});

$(".moveCarouselRight").dblclick(function(event){ 
    return false; 
});

$(".moveCarouselRight").one("click", function(event) { 
    //do something 
});

鏈接：http://api.jquery.com/one/

來源

2013-12-09 14:30:13 Ani

好主意，雖然由於某種原因，當我雙擊元素，它也產生兩個單一的點擊，應該防止默認不處理這個？ –

它應該或者你可以嘗試'返回false;甚至當我使用返回false JS的控制檯顯示上的「DBLCLICK」處理 – Ani

：HTTP：/ /api.jquery.com/one/ –

我通過在負載點擊事件結合到選擇的固定這樣的：

$('.selector').click(moveLeft);

在該方法我解開的點擊事件：

function moveLeft() { 
    $(this).unbind('click'); 
    //css transition stuff 
}

然後，我添加了一個監聽器CSS轉換結束：

$("selector").bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){ 
    $(this).siblings('.nextThree').click(moveThreeRight); 
});

作品的魅力:)

感謝這個

來源

2013-12-09 18:25:22

傳送帶動畫事件問題

回答

相關問題