javascript，將按鈕單擊下滑div div？

Question

我試圖讓用戶點擊另一個div作爲關閉按鈕時，使用javascript下滑約200px的頁面。

有人可以告訴我我該怎麼做？

<script> 
$('.chat_close').click(function(e){ 
     $('.chat_box').slideDown(); 
    }); 

</script> 

Answer 1

使用animate

此外，使用.on

<script type="text/javascript"> 
$('.chat_close').on('click', function(e){ 
     $('.chat_box').animate({"top": "200px"); 
    }); 

</script> 

HTML：

<div class="chat_close"> 
</div> 

Answer 2

已經有人問同樣的問題，前一陣子。阿維納什說：

var minheight = 20; 
var maxheight = 100; 
var time = 1000; 
var timer = null; 
var toggled = false; 

window.onload = function() { 
    var controler = document.getElementById('slide'); 
    var slider = document.getElementById('slider'); 
    slider.style.height = minheight + 'px'; //not so imp,just for my example 
    controler.onclick = function() { 
     clearInterval(timer); 
     var instanceheight = parseInt(slider.style.height); // Current height 
     var init = (new Date()).getTime(); //start time 
     var height = (toggled = !toggled) ? maxheight: minheight; //if toggled 

     var disp = height - parseInt(slider.style.height); 
     timer = setInterval(function() { 
      var instance = (new Date()).getTime() - init; //animating time 
      if(instance <= time) { //0 -> time seconds 
       var pos = instanceheight + Math.floor(disp * instance/time); 
       slider.style.height = pos + 'px'; 
      }else { 
       slider.style.height = height + 'px'; //safety side ^^ 
       clearInterval(timer); 
      } 
     },1); 
    }; 
}; 

您可以通過以下網址看到它在這裏：

http://jsbin.com/azewi5