jquery動畫回調問題

Question

我試圖在此動畫上使用回調，以便在動畫完成後正在進行動畫處理的圖像會回到其原始狀態。但它沒有正常工作。有人能告訴我如何用正確的語法來做到這一點嗎？

if (currentEffect == "glimpse") { 
    $("#next").click(function() { 
     if (currentSlide == 0) { 
      $("#slide1").animate({ 
       width: "0", 
       opacity: 0.2, 
       borderWidth: "10px" 
      }, 1000, function() { 
       width: "700px" 
       opacity: 100, 
       borderWidth: "0px" 
      }); 
      $("#slide2").fadeIn(800); 
     } 
    }); 
} 

Answer 1

if (currentEffect == "glimpse") { 
    $("#next").click(function() { 
     if (currentSlide == 0) { 
      $("#slide1").animate({ 
       width: "0", 
       opacity: 0.2, 
       borderWidth: "10px" 
      }, 1000, function() { 
       $(this).animate({ // <-- need to call .animate() again 
        width: "700px" // <--- you forgot a , 
        opacity: 100, // <--- opacity is a value between 0.0 and 1.0 
        borderWidth: "0px" 
       }, 1000); 
      }); 
      $("#slide2").fadeIn(800); 
     } 
    }); 
} 

Answer 2

回調功能不被引用的對象。您可能想要：

$("#slide1").animate({ 
    width: "0", 
    opacity: 0.2, 
    borderWidth: "10px" 
}, 1000, function() { 
    $("#slide1").css({ 
     width: "700px", 
     opacity: 1, 
     borderWidth: "0px" 
    }); 
});