当我尝试使用javascript向下滑动约200px的div时,用户点击另一个div作为关闭按钮。
有人可以告诉我我会怎么做吗?
<script>
$('.chat_close').click(function(e){
$('.chat_box').slideDown();
});
</script>
答案 0 :(得分:1)
前段时间有人已经问了同样的问题。阿维纳什回答:
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);
};
};
您可以在此处看到此处:
答案 1 :(得分:0)
使用animate
另外,请使用.on
<script type="text/javascript">
$('.chat_close').on('click', function(e){
$('.chat_box').animate({"top": "200px");
});
</script>
<强> HTML:强>
<div class="chat_close">
</div>