Простой эффект эффекта галереи слайдов. Авто происходит только один раз

Question

рабочих демо CLick

$(document).ready(function(e) { 
$('span#pijlr, span#pijll').show(); 
$('#gallery').css('overflow','hidden'); 
$('span#pijlr').click(function(e) { 
    if (!$('#gallcont').is(':animated')) { 
    var slide = 490; 
    var variable = $('#gallcont').css('left'); 
    var urechts = "-980px"; 
    if(variable > urechts) { 
     $('#gallcont').animate({'left': '-=' +slide+ 'px'},'fast','linear'); 
    } 
    } 
}); 
$('span#pijll').click(function(e) { 
    if (!$('#gallcont').is(':animated')) { 
    var slide = 490; 
    var variable = $('#gallcont').css('left'); 
    var ulinks = "0"; 
    if(variable < ulinks) { 
     $('#gallcont').animate({'left': '+=' +slide+ 'px'},'fast','linear'); 
    } 
    } 
}); 
}); 

Проблема с следующей кнопкой (интервал # pijlr). Если я нажму один раз, то подумаю, и пойду слишком -490px, но когда я нажму снова, он ничего не сделает. Я попробовал настроить переменные уречки, но когда я увеличиваю число, скажем, около -1000px, он будет работать, за исключением того, что он выходит за пределы его пределов.

Answer 1

Это ваша проблема:

if(variable > urechts) {

variable и urechts являются строки, вы не можете сравнить их численно.

Изменить строку (ей) что-то вроде этого, используя parseInt, чтобы получить численное значение:

if(parseInt(variable) > parseInt(urechts)) {

Вы также можете изменить urechts/ulinks быть целыми числами и делать только ParseInt раз:

var urechts = "-980px"; 
if(parseInt(variable) > urechts) { ... } 

Fixed пример: http://jsfiddle.net/jtbowden/sVqNq/5/

Редактировать: Было указано, что это не работает в Chrome. Это связано с тем, что Chrome возвращает «auto» в качестве значения left() при первом вызове, если он явно не определен. Просто добавьте left: 0px в css для .pol. В противном случае вам нужно проверить «авто» в своем коде.