У меня есть внизу в вычитании выражения else, которое отлично работает, но оператор if неправильно добавляет значения. Как работает скрипт, когда пользователь прокручивает его, он перемещается так же быстро, как значение скорости-гонщиков говорит ему двигаться, скорость-гонщик вычитается из смещения гонщика, когда смещение гонщика равно 0, оно останавливает любое дальнейшее движение, а затем, когда пользователь прокручивает назад в противоположном направлении, он должен добавить значение скорости-гонщика обратно к смещению гонщика, пока он не достигнет значения LeftMovements, в котором он остановится. Он вычитает правильно, но когда предполагается добавить значения обратно, начинается проблема. На изображении ниже вы видите при вычитании racer-offset = "2525252525252525", что он должен делать, принимает значение 25 + добавить его к существующему значению, и это будет значение смещения гонщика, до следующего прокрутки происходит. спасибо
Проблемный код ------
$('.images').each(function(){
if($(this).position().left >= $(this).attr('loc')){
console.log("0 == stopped");
}
else {
speedR = $(this).attr('speed-racer');
$(this).css({left : "+="+speedR});
$(this).attr('racer-offset') + speedR;
$(this).attr('racer-offset', $(this).attr('speed-racer') + $(this).attr('racer-offset'));
}
});
Весь код:
$(window).scroll(function(){
if(lastLeftLocation > $(document).scrollLeft()) {
$('.images').each(function(){
if($(this).position().left >= $(this).attr('loc')){
console.log("0 == stopped");
}
else {
speedR = $(this).attr('speed-racer');
$(this).css({left : "+="+speedR});
$(this).attr('racer-offset') + speedR;
$(this).attr('racer-offset', $(this).attr('speed-racer') + $(this).attr('racer-offset'));
}
});
}
else {
$('.images').each(function(){
if($(this).attr('racer-offset') <= 0){
console.log("0 == stopped");
}
else {
speedR = $(this).attr('speed-racer');
$(this).css({left : "-="+speedR});
$(this).attr('racer-offset', $(this).attr('racer-offset') - speedR);
}
});
}
});
HTML
<img class="images" racer-offset="1075" speed-racer="25" src="http://feeneywireless.com/assets/img/fwman/FeeneyMan_prod_st.png" loc="1344" leftmovement="1300" style="left: 1119px;">
Вычитание неверно
Правильное добавление
Вы не конвертируете свои значения в целые числа. Поэтому ваш результат представляет собой конкатенированную строку:
"250" + "250" = "250250";
Чтобы преобразовать ваши значения в целые числа, просто добавьте Unary Plus (+
) перед вызовом:
speedR = +$(this).attr('speed-racer');
А также:
$(this).attr('racer-offset',
+$(this).attr('speed-racer') + +$(this).attr('racer-offset'));
При преобразовании в целое число:
250 + 250 = 500;
"1" + "2" === "12"
. Помещение +
впереди делает это преобразование для вас: +"1" + +"2" === 3
. См. Ссылку на Unary Plus в моем ответе для более подробного описания.
Вы выполняете конкатенацию строк вместо арифметического добавления, преобразуете строку в int, используя parseInt(), прежде чем добавлять их
$(this).attr('racer-offset', parseint($(this).attr('speed-racer'), 10) + parseInt($(this).attr('racer-offset'), 10));
parseInt()
имеет два параметра: значение и основание. Здесь база 10 (десятичная). Например, вы можете захотеть вывести ваши числа в двоичном виде; для этого вы должны использовать базу 2 и т.д ...
$(this).attr('racer-offset') + speedR;
ничего не делает. Вы добавляете два значения вместе, но не сохраняете это значение вообще или не используете его каким-либо образом.