jQuery的動畫觸發點擊

我在我的身體的元素，我蒙山動畫此功能：jQuery的動畫觸發點擊

$(function(){ 
    $("#telefonofisso").click(function(){ 
     if ($("#telefonofisso").hasClass('negative')) { 
      $(this).delay(400).animate({right:'10px'},1000).addClass('positive').removeClass('negative') 
     } 
    }); 
})

但我不能讓它恢復到原來的位置right:-210px如果我點擊它另一個時間。我試着用下面的函數：

$(function(){ 
    $("#telefonofisso").click(function(){ 
    if ($("#telefonofisso").hasClass('positive')) { 
     (this).delay(400).animate({right:'-210px'},1000).addClass('negative').removeClass('positive') 
    } 
    }); 
})

但在此之前我點擊第二次，如果我點擊它，這個功能激活，所以我的元素，從right:-210px開始，去right:10px比返回right:-210px只是一個單擊。

我該如何解決這個問題，爲什麼它會這樣做？我無法理解它這樣做的原因。因爲理論上觸發是點擊，而第二個功能應該只在第二次點擊時才起作用，對吧？

來源

2015-04-08 Tommy D

使用兩個條件組合點擊功能的處理程序。由於您有兩個點擊處理程序，它們正在同時執行。 –

是的，我可以看到它們是同時執行的，但對我來說沒什麼意義，因爲第二個只能激活，如果我的元素具有「積極」級別，並且它可以只是「積極」或「一次性「。所以兩者中的一個不應該工作。 –

'addClass（'positive'）'在動畫結束之前執行。在動畫回調函數中使用它。我將演示如果您創建JSfiddle的問題 –

試試這個：

$(function(){ 
    $("#telefonofisso").click(function(){ 
    if ($("#telefonofisso").hasClass('positive')) { 
     $(this).delay(400).animate({right:'-210px'},1000) 
       .addClass('negative').removeClass('positive'); 
    } else { 
     $(this).delay(400).animate({right:'10px'},1000) 
       .addClass('positive').removeClass('negative');  
    } 
    }); 
});

這將解決您的問題。

而你在第二個電話中忘記了$登錄。

來源

2015-04-08 06:54:10

謝謝，這個工程。 –

試試這個工作演示，按您的要求

$(function(){ 
     $("#telefonofisso").click(function(){ 
      var modified = $('.slider').css('left') === '250px' ? '0px' : '250px';    
      $('.slider').animate({    
       left : modified 
      }, 300) 
     }); 
    })

http://jsfiddle.net/stanze/02e11v2p/1/

來源

2015-04-08 07:30:09 stanze

謝謝，你的回答很有趣！你能解釋一下sintax'==='250px'嗎？ '0px'：'250px';'我從來沒有見過它，它有什麼作用？ –

我正在使用javascript比較運算符和三元運算符此運算符需要三個操作數也是一個shorcut if語句。像明智的第一次，我檢查「滑塊」類包含左側位置250px比再次將左側位置設置爲0px。 – stanze

jQuery的動畫觸發點擊

回答

相關問題