关于if语句和位置移动的jQuery问题

时间:2010-11-26 04:46:11

标签: jquery html css syntax jquery-animate

我正在尝试编写一个基本上用户点击图像的程序,然后图像将向右移动25px。当我点击图像时图像会移动,但我尝试添加一段代码,使图像在通过窗口右侧时返回到窗口的左侧。我已尝试在动画的过程中使用If语句但它似乎不起作用。这就是我所拥有的:

$('#image').click(function() {
$(this).animate({
   left: '+=155',
function() {
    if ($(this).left > $(document).width)  {
 $(this).left = 0
  }
   };

    });

});


我使用错误的语法还是我的功能错了?谢谢你的帮助。

2 个答案:

答案 0 :(得分:1)

我会这样做......

$('#image').click(function() {

     $(this).animate({
            left: '+=155',
            function() {
                if ($(this).offset().left > $(document).width)  {
                   $(this).css({ left: 0 });
                }


       });
});

虽然最好先将移位像素添加到原始left,并确保不超过宽度。在这种情况下,return false并且根本不移动元素。

您可能还希望在计算之前将#image的宽度添加到偏移量,否则在元素的最左侧超出之前不会触发它已超过。

答案 1 :(得分:0)

你的持续时间在哪里?

试试这个,

$('#image').click(function() {
     $(this).animate(
            {
               left: '+=155'
            },
            5000,
            function() {
                if ($(this).left > $(document).width)  {
                $(this).left = 0
                }    
       );
});