Question

我有一些功能，左右滑动div。它工作得很好，除了我需要它一旦用户到达div的结尾就停止。 IE：左箭头应该向左移动：0;。任何有关这方面的帮助将不胜感激！

$(".left-arrow").mouseover(function(){
  playanim("+=30px");
}).mouseleave(function(){
  stopanim();
}); 

$(".right-arrow").mouseover(function(){
  playanim("-=30px");
}).mouseleave(function(){
  stopanim();
}); 

function playanim(speed) {
  // launch the anim with the desired side
  $("#slides").animate({ 
    left: speed,
  }, 1000,'linear',function(){playanim(speed);});
}

function stopanim() {
  // stop the animation and clear the animation queue
  $("#slides").stop(true);
}

Answer 1

您可以使用position或Offset检查左侧位置。

使用position的解决方案：

function playanim(speed) {

  var position = $("#slides").position();

  //if position (or offset, if you like) is more than 0, we may move.
  if ( position.left > 0 ) {
     // make sure you don't accidentally go more left than 0
     if( position.left < 30) {
        speed = 30 - position.left;
     }
     // launch the animation with the desired side
     $("#slides").animate({ 
        left: speed,
     }, 1000,'linear',function(){playanim(speed);});
   }
}

Answer 2

你只需要添加一个while语句，在while语句之前使用jquery的position方法来获取元素的位置。

While(position!={left:0}) // Or something like that
{
    //then move
}

您可以在http://api.jquery.com/position/

找到位置参考

如果留下＆lt; = 0，则停止动画

2 个答案: