Остановить анимацию, если осталось <= 0

0

У меня есть несколько функций, которые слайды 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);
}
Теги:
jquery-animate

2 ответа

3
Лучший ответ

Вы можете проверить положение влево, используя позицию или смещение.

Решение с использованием 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);});
   }
}
  • 1
    +1 для проверки позиции и использования целых вместо строк.
0

Вам просто нужно добавить оператор while и до того, как оператор while использует метод позиции jquery, чтобы получить позицию элемента.

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

Вы можете найти ссылку для позиции здесь http://api.jquery.com/position/

  • 0
    position это объект. Вы не можете использовать это прямо здесь. Смотрите мой ответ ниже

Ещё вопросы

Сообщество Overcoder
Наверх
Меню