2013-11-18 3 views
0

У меня есть функция, взятая с помощью учебника, она отлично работает с одним единственным элементом, но я хочу использовать его с некоторыми элементами, и я не знаю достаточно о Javascript для этого.специфическая функция в Javascript

Это моя функция:

var elements = document.getElementsByClassName('boules'); 
for (var i = 0; i < elements.length; i++) { 
    gameAccel(elements[i]); 
} 

function gameAccel(sphere) { 
    var x=20,y=300,vx=0,vy=0,ax=0,ay=0; 
    if(window.DeviceMotionEvent!=undefined){ 
     window.ondevicemotion=function(e){ 
      ax=event.accelerationIncludingGravity.x*3; 
      ay=event.accelerationIncludingGravity.y*3; 
     } 
     monInterval = setInterval(function(){ 
      var landscapeOrientation=window.innerWidth/window.innerHeight>1; 
      if(landscapeOrientation){ 
       vx=vx+ay; 
       vy=vy+ax; 
      }else{ 
       vy=vy-ay; 
       vx=vx+ax; 
      } 
      vx=vx*0.98; 
      vy=vy*0.98; 
      y=parseInt(y+vy/50); 
      x=parseInt(x+vx/50); 
      boundingBoxCheck(); 
      sphere.style.top=y+"px"; 
      sphere.style.left=x+"px";         
     },25); 
    } 
    function boundingBoxCheck(){ 
     if(x<0){x=0;vx=-vx;} 
     if(y<0){y=0;vy=-vy;} 
     if(x>document.documentElement.clientWidth-40){ 
      x=document.documentElement.clientWidth-40; 
      vx=-vx; 
     } 
     if(y>document.documentElement.clientHeight-40){ 
      y=document.documentElement.clientHeight-40; 
      vy=-vy; 
     } 
    } 
} 

У меня есть один элемент с классом «буль», это работает, если у меня есть несколько элементов с классом «игры в шары» это не работает.

Эта функция используется на мобильных устройствах с гироскопом. (это основной пример http://www.albertosarullo.com/demos/accelerometer/).

Кто-то может объяснить мне, почему и как я могу это исправить?

Большое спасибо.

+0

Ожидается, что все '.boules' будут иметь одинаковую позицию? Если это так, то просто используйте цикл над 'элементами', где вы назначаете координаты. – Bergi

ответ

1

Вы переписываете window.ondevicemotion и monInterval каждый раз, когда вы вызываете функцию. Будет запущен только последний обработчик. Вместо этого используйте addEventListener для подключения нескольких обработчиков и local variable.

+0

hm ok Я понимаю переписывание. Можете ли вы привести пример для решения проблемы с addEventListener? – user1799879

+0

Просто используйте этот метод вместо присвоения свойству 'ondevicemotion'. – Bergi

+0

Я изменил эту часть: window.addEventListener ("devicemotion", onDeviceMotion, false); function onDeviceMotion (event) {ax = event.accelerationIncludingGravity.x * 3; ay = event.accelerationIncludingGravity.y * 3; } Все нормально? И для интервала я не знаю, что мне нужно делать. – user1799879

0

У вас есть перезапись window.ondevicemotion обработчик в каждом цикле. Он должен работать только для последнего обработчика.

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