javascript - 想要 jQuery 帮助...

Question

我有一个站点，右侧有一个弹出窗口。并有一个按钮。我的问题是，如果我单击该按钮，那么弹出窗口将向左移动，如果我再次单击该按钮，那么弹出窗口将返回它之前的位置，我的意思是正确的。这就像 slideToggle 。我尝试了一些东西。但它只剩下了，但它不会回去。怎么做 ？

<script>
function goto(){    
    //animate to the div id.
    $(".pop_up").animate({"left": -($(id).position().left)});

}
$(document).ready(function(){
  $(".red_sec").click(function(){
    $(".pop_up").animate({left:'-560px'});
  });
});
</script>

对不起我的英语不好。

谢谢

Answer 1

试试这个代码，这将给出一个toggle effect.

$(document).ready(function(){
  $(".red_sec").click(function(){
       $(".pop_up").animate({'left': ($(".pop_up").position().left == -560)?100:-560});
  });
});

小提琴

Answer 2

保持简单，我会说。为.pop_up元素提供数据属性并使用它来确定动画应该走的路：

function goto(){    
    var direction = $(".pop_up").attr('data-lr');
    $(".pop_up").animate( {left: direction} );
    $(".pop_up").attr('data-lr',direction === '+=100' ? '-=100' : '+=100');

}

$(".red_sec").click(goto);

这是一个jsFiddle