javascript - javascript .hide 方向改变

Question

使用 jQuery 有 hide() 函数。

当您像这样向隐藏功能添加持续时间时

$('#myclass').hide(1000);
<div id="myclass">
    <p>yolo</p>
</div>

它将从底部开始，并在一秒钟内向上动画。

我的问题是如何改变它开始的方向。

Answer 1

从文档中.hide( duration )：

当提供持续时间、普通对象或“完整”函数时，.hide()就变成了动画方法。该.hide()方法同时为匹配元素的宽度、高度和不透明度设置动画。当这些属性达到 0 时，设置displaystyle 属性none以确保元素不再影响页面的布局。

该元素仅显示为向上和向左动画，因为它位于其左上角。

要让它在另一个方向上动画，它必须定位在不同的角落：

#myclass {
    position: absolute;
    bottom: 0;
    right: 0;
}

示例：http: //jsfiddle.net/W7hqy/

Answer 2

尝试这个。

$('div').on('click', function(){
    $(this).animate({
        width: 0
    });
});

演示：http: //jsfiddle.net/e6BBA/1/

Answer 3

您不能使用 hide 方法执行此操作假设您使用 jQuery，您将需要像这样使用 animate

$('element').animate({
    marginLeft: '-400px'
}, '5000',  function(){ 
    $(this).hide() 
});

演示：http: //jsfiddle.net/e6BBA/