javascript - jquery animate - 返回到原来的位置

Question

我有一个 jquery animate，它在单击按钮时移动一个 div:

<script> 
$(document).ready(function(){
    $("#toggle1").click(function(){
        $("#holder").animate({right: '0px'});
    });
});
</script>

如果再次点击按钮，我希望能够将其返回到原始选项

$("#holder").animate({right: '-250px'}); // off the screen

有没有一种简单的方法可以做到这一点，或者我应该尝试根据变量状态实现一个 if 语句？

Answer 1

你有两种方法

1st:为此使用 bool 值

<script> 
$(document).ready(function(){
    var toggeled = true;
    $("#toggle1").click(function(){
      if(toggeled == true){
        $("#holder").animate({right: '0px'});
        toggeled = false;
      }else{
        $("#holder").animate({right: '-250px'});
        toggeled = true;
      }
    });
});
</script>

第二:检查是否正确

$(document).ready(function(){
    $("#toggle1").click(function(){
      if(parseInt($("#holder").css('right')) == 0){
        $("#holder").animate({right: '-250px'});
      }else{
        $("#holder").animate({right: '0px'});
      }
    });
});