jquery - 如何使用两个箭头图标为 div 设置动画，一个是打开的，一个是关闭的？

Question

我正在使用 jquery animate 在中间做一些 div 动画，我击中了任何人都可以帮助继续。

我的要求是当我单击箭头图标时 div 应该动画。在动画 div 折叠后，左侧箭头需要显示以关闭折叠的地方。

我添加了两张图片，一张用于打开，另一张用于关闭。

JsFiddle 链接

http://jsfiddle.net/CZpdF/1/

Answer 1

$("#buying-power-right, #buying-power-left").click(function() {
    $(this).attr('id', function() {
        return this.id == 'buying-power-right' ? "buying-power-left" : "buying-power-right";
    });
    $("#buying-power-content").animate({
        width: 800
    }, {
        queue: false,
        duration: 200
    }).toggle();
});

演示

Answer 2

#buying-power-content有display:none;

您必须在点击事件中显示它。

$("#buying-power-content").show().animate({width:800}, { queue: false, duration: 200 });