jquery-animate - PollSlider 隐藏、动画、隐藏

Question

我只是从上一篇关于 pollslider 的帖子中跟进 - 看到这个小提琴：http: //jsfiddle.net/XNnHC/3/

我试图让 pollSlider div 最初被隐藏，当您单击 pollSlider 按钮时，pollSlider div 变为可见，然后动画到位。然后当再次单击按钮时 pollSlider div 动画然后隐藏。

$(document).ready(function()
{
  $('#pollSlider-button').click(function() {
    if($(this).css("margin-right") == "200px")
    {
        $('.pollSlider').animate({"margin-right": '-=200'});
        $('#pollSlider-button').animate({"margin-right": '-=200'});
    }
    else
    {
        $('.pollSlider').animate({"margin-right": '+=200'});
        $('#pollSlider-button').animate({"margin-right": '+=200'});
    }
  });
 });  

Answer 1

动画你的投票宽度而不是margin-right。像这样的东西：

我的小提琴

$(document).ready(function()
{
  $('#pollSlider-button').click(function() {
    if($(this).css("margin-right") == "200px")
    {
        $('.pollSlider').animate({"width": '-=200'});
        $('#pollSlider-button').animate({"margin-right": '-=200'});
    }
    else
    {
        $('.pollSlider').animate({"width": '+=200'});
        $('#pollSlider-button').animate({"margin-right": '+=200'});
    }


  });
 });