0

Есть объект, при нажатии перед ним он движется вперед (вправо), при нажатии позади него - назад (влево).

var car = document.querySelector(".car");
var road = document.querySelector(".road");
car.style.left = '1px';

var go = new Object;
go = {
    right : function(){
        car.style.left = parseInt(car.style.left) + 20 + 'px';
    },
    left : function(){
        car.style.left = parseInt(car.style.left) - 20 + 'px';
    }
}

road.addEventListener('click', function(e){
    var value = Math.round(e.pageX) + 'px';
    if(value > car.style.left){
        go.right();
    }
    if(value < car.style.left){
        go.left();
    }
}, false)

Но какое бы значение не передавал курсор (сзади или спереди объекта) он движется только влево. Подскажите как решить этот недочет?

4
  • Я думаю это потому, что вы сравниваете не числа, а строки. У вас получается что-то типа if ('20px' > '13px'), а нужно сравнить именно числа, а потом уже добавлять куда нужно пиксели Commented 30 дек. 2015 в 9:43
  • точно! спасибо Алексей. 'road.addEventListener('click', function(e){ var value = Math.round(e.pageX); if(value > car.style.left.split('px')[0]){ go.right(); } if(value < car.style.left.split('px')[0]){ go.left(); } }, false)'
    – Веня
    Commented 30 дек. 2015 в 9:46
  • 1
    @Веня, небольшой оффтоп: new Object эквивалентно {}
    – dzhioev
    Commented 30 дек. 2015 в 13:04
  • @АлексейШиманский Пожалуйста, опубликуйте ваш комментарий в виде ответа. Commented 19 февр. 2016 в 6:26

1 ответ 1

1
if(value > car.style.left){
if(value > parseInt(car.style.left, 10)) {

И остальные места аналогично.

2
  • тогда и про эту строчку надо сказать: var value = Math.round(e.pageX) + 'px'; :-)
    – Grundy
    Commented 30 дек. 2015 в 13:18
  • @Grundy, да, точно.
    – Qwertiy
    Commented 30 дек. 2015 в 14:00

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.