我怎么能有一个div从折叠到展开(反之亦然),但这样做从右到左?

我在外面看到的大部分东西都是从左到右的。


当前回答

我是这样做的:

var btn_width = btn.width();
btn.width(0);
btn.show().animate({width: btn_width}, {duration: 500});

注意,节点“btn”应该在动画之前隐藏,您可能还需要为它设置“position: absolute”。

其他回答

$("#slide").animate({width:'toggle'},350);

参考:https://api.jquery.com/animate/

这可以通过使用jQueryUI隐藏/显示方法来实现。 如。

    // To slide something leftwards into view,
    // with a delay of 1000 msec
    $("div").click(function () {
          $(this).show("slide", { direction: "left" }, 1000);
    });

参考:http://docs.jquery.com/UI/Effects/Slide

另一个值得一提的库是animation .css。它可以很好地与jQuery一起工作,您可以简单地通过切换CSS类来制作许多有趣的动画。

像. .

$(“#slide”).toggle().toggleClass('animation bounceInLeft');

我是这样做的:

var btn_width = btn.width();
btn.width(0);
btn.show().animate({width: btn_width}, {duration: 500});

注意,节点“btn”应该在动画之前隐藏,您可能还需要为它设置“position: absolute”。

你可以先定义元素的宽度为0,右浮动,然后在你要显示它的事件上。就像这样

$('#the_element_to_slide_from_right_left').animate({ width:'your desired width' }, 600);

就这么简单。