如何將兩個動畫同時應用於同一個元素？

Question

我試圖將兩個不同的緩動同時應用到相同的元素，但我不能讓它工作。這是我試過的：

$(window).load(function() { 

     var speed = 1500; 
     var delay = 0; 

     for(var i = 0 + 1; i <= $('.skills li').length; i++) { 

      var li = $('.skills li:nth-child(' + (i + 1) + ')'); 

      li.delay(delay).animate({ 
       left: "0" 
      },{ 
       duration: speed, 
       queue: false, 
       easing: 'easeOutBounce' 
      }); 
      li.delay(delay).animate({ 
       opacity: 1 
      },{ 
       duration: speed, 
       queue: false, 
       easing: 'easeOut' 
      }); 

      delay += 150; 
     }; 
    }); 

在此先感謝！

Answer 1

您可以將多個屬性更改參數添加到動畫對象中。

for (var i = 0; i <= $('.skills li').length; i++) { 

    var li = $('.skills li:nth-child(' + (i + 1) + ')'); 
    li.stop(true, true).delay(i * 150).animate({ 
     left: "0", 
     opacity: 1 
    }, { 
     duration: speed, 
     queue: true, //do you want one-by-one or all together , please specify? 
     specialEasing: { 
      width: "linear", 
      height: "easeOutBounce" 
     } 
    }); 

};