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

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


当前回答

我是这样做的:

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

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

其他回答

或者你可以用

$('#myDiv').toggle("slide:right");

用这个:

$('#pollSlider-button').animate({"margin-right": '+=200'});

现场演示

改进版本

演示中添加了一些代码,以防止双击时出现双重空白:http://jsfiddle.net/XNnHC/942/

轻松使用它;)

http://jsfiddle.net/XNnHC/1591/

删除了额外的JavaScript代码。 类名和一些CSS代码更改 增加了查找是否展开或折叠的功能 改变了是否使用缓和效果 改变动画速度

http://jsfiddle.net/XNnHC/1808/

请看这里的例子。

$("#slider").animate({width:'toggle'});

https://jsfiddle.net/q1pdgn96/2/

$(function() {
  $('.button').click(function() {
    $(this).toggleClass('active');
    $('.yourclass').toggle("slide", {direction: "right"}, 1000);
  });
});

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

像. .

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