2015-10-15 5 views
-3

Я проделал простой код для прослушивания, точка - переместить div влево, когда я нажимаю стрелку влево и, очевидно, направо, когда нажата стрелка вправо. Я хочу присвоить значение Left css переменной #divcar переменной. Это мой код:Значение левого css для переменной JQuery

<!doctype html> 
<html lang="en"> 

    <head> 
     <meta charset="UTF-8" /> 
     <title>Car game</title> 
     <style type="text/css" media="screen"> 
      #divcar { 
       position: absolute; 
       top: 60%; 
       left: 49%; 
       height: 70px; 
       width: auto; 
      } 
      #car { 
       height: 70px; 
       width: auto; 
      } 
     </style> 
     <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
     <script> 
      $(document).ready(function() { 
       var left = $('#divcar').left(); 
       $(document).keydown(function(e) { 
        if (e.keyCode == 37) { 
         alert("left pressed"); 
         $("#divcar").css('left', left - '10%'); 
         return false; 
        } 
        if (e.keyCode == 39) { 
         alert("right pressed"); 
         return false; 
        } 
       }); 
      }); 
     </script> 
    </head> 

    <body> 
     <div id="divcar"> 
      <img src="car_topview.png" alt="Car" height="70" id="car" /> 
     </div> 
    </body> 

</html> 

Проблема заключается в том, что когда я запускаю код, я получаю эту ошибку: TypeError:. $ (...) левая не является функцией.

Как исправить эту

Благодарности

+1

Заменить '.left()' с которая фактически существует ... например, '.css ('left')'. –

+1

О, и это '-10%' не будет работать. –

ответ

1

Проблема эта линия:

var left = $('#divcar').left(); 

"Left" не является функцией JQuery. Вы должны использовать:

var left = $('#divcar').css('left'); 
0

Первый вопрос заключается в том, что $('#divcar').left() не является функцией (как сказано) ..

И $("#divcar").css('left', left - '10%'); не будет работать, как left - 10% не является собственным числом.

Ваш код должен быть что-то вроде этого:

$(document).ready(function(){ 
    var left = $('#divcar').css('left') * 1, // use *1 to be sure that left is a number 
     offset = 0.1 * left; // get the 10% i.e. 10/100 = 0.1 
    $(document).keydown(function(e){ 
     if (e.keyCode == 37) { 
      alert("left pressed"); 
      $("#divcar").css('left', left - offset); 
      return false; 
     } 
     if (e.keyCode == 39) { 
      alert("right pressed"); 
      return false; 
     } 
    }); 
}); 

Вы также могли бы упростить ее, получая непосредственно 90% (т.е. 0,9) из left

$(document).ready(function(){ 
    var newleft = $('#divcar').css('left') * 0.9; 
    $(document).keydown(function(e){ 
     e.preventDefault(); 
     if (e.keyCode == 37) { 
      alert("left pressed"); 
      $("#divcar").css('left', newleft); 
     } 
     if (e.keyCode == 39) { 
      alert("right pressed"); 
     } 
    }); 
}); 
+0

Спасибо, что помогли мне с var, но фрагмент, который вы сделали, не работает. Когда я нажимаю влево, он не перемещается. – SwegreDesigns

+0

Можете ли вы сделать простой jsfiddle, пожалуйста? – SwegreDesigns

Смежные вопросы