jquery animate在切換時無法正常工作

我有以下代碼。代碼的第一部分 - 單個動畫，按預期工作 - div降至50％。jquery animate在切換時無法正常工作

另一方面切換導致div消失 - 看起來減少寬度和高度，直到div不再可見。它以同樣的方式再現。

我不是jquery的專家 - 任何想法？

// works 
    $(".test-wrapper").animate({ 
      width: "50%" 
     }, 400); 

    // Doesn't work 
    $(".test-wrapper").toggle(
    function() { 

     $(this).animate({ 
      width: "50%" 
     }, 400); 
    }, 
    function() { 
     $(this).animate({ 
      width: "100%" 
     }, 400); 
    });

來源

2014-11-06 dotnetnoob

您是否試圖找出函數內部的$（this）？可能是這個「this」所指的對象不是你想要的對象。 – legendofawesomeness 2014-11-06 18:15:17

你正在使用哪個jQuery版本？有http://api.jquery.com/toggle/和http://api.jquery.com/toggle-event/ – 2014-11-06 18:17:38

@legendofawesomeness我已經用選擇器取代了這個 - 有些東西是錯誤的警報不會觸發裏面的第一個切換功能 – dotnetnoob 2014-11-06 18:26:12

您應該使用click代替：

$(".test-wrapper").click(function() { 
    $(this).animate({ 
     width: !this.toggled ? "50%" : "100%" 
    }, 400); 
    this.toggled = !this.toggled; 
});

你肯定使用jQuery 1.9版>所以使用的，而不是這個去掉一個toogle event

這個one (toggle)。

來源

2014-11-06 18:26:34

與去除的好位置 - 使用2.1 – dotnetnoob 2014-11-06 18:32:43

完美的解決方案 – dotnetnoob 2014-11-06 18:36:37

jQuery的切換與動畫不一樣。切換隻是隱藏/顯示元素。 Here's the doc

要實現你正在做的事情，你需要定義2個不同的動畫，並使用一個測試來知道你需要運行哪一個動畫。

來源

2014-11-06 18:17:32

jquery animate在切換時無法正常工作

回答

相關問題