動畫窗口與easing

Question

我有一個元素，當我點擊一個按鈕，它的作品將打開，但現在我需要動畫它，這就是我不知道要做的。這是我的代碼：

jQuery的

$(".trigger-window-1").on("click", function(e){ 
    e.preventDefault(); 
    $(".window-1").toggleClass("closed-window"); 
}); 

當我點擊元素與「.trigger窗口-1"它與類」 打開窗口中的類.trigger-window-1「，很簡單，但現在我想動畫，我不知道如何。

PD：我知道我必須使用動畫功能，但我無法弄清楚如何。謝謝。

Answer 1

您可以在很多不同的基於數據的值（如高度）上調用animate函數。你可以看到jQuery的動畫功能doc here

下面是一個例子：

$(".trigger-window-1").on("click", function(e){ 
e.preventDefault(); 
$(".window-1").toggleClass("closed-window"); 
if($(".window-1").hasClass('closed-window')) { 
    $(".window-1").animate({ 
     'height':100 
    }); 
} else { 
    $(".window-1").animate({ 
     'height':200 
    }); 
} 

}）;

Here a live example of the above on jsfiddle