Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 23.04.2016, 17:50   #1
Amx1337
 
Регистрация: 23.04.2016
Сообщений: 4
По умолчанию Движение картинки по траектории JS

Подскажите пожалуйста, как сделать чтоб шарик летел до центра екрана и отбиваясь от квадрата летел в правый нижний угол(и останавливался там)?
Код:
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>
  <title></title>
</head> 
<body id="body" style="background: grey">
 
        <img  id="k"  src="circle.png"  style="position: absolute;" height="100px;" width="100px;">
        <img  id="s"  src="p.bmp"  style="position: absolute;" height="100px;" width="100px;">
        <img  id="t"  src="t.bmp" style="position: absolute; height:100px; width: 100px;">
        <script type="text/javascript">
                var p =  -Math.PI / 4;
                var r = 3;
 
                var W=document.getElementById('body').clientWidth;
                var H=document.getElementById('body').clientHeight;
                
         var circle = document.getElementById('k');
         var triangle = document.getElementById('t');   
          var squad = document.getElementById('s');
          var l=circle.offsetLeft;
          var w= circle.offsetWidth;
 
         var t=circle.offsetTop;
         var h=circle.offsetHeight;
 
       var tw=triangle.offsetWidth;
       var th=triangle.offsetHeight;
       var tl=triangle.offsetLeft;
       var tt=triangle.offsetTop; 
 
       triangle.style.left= 0 + 'px';
       triangle.style.top=(H-th) + 'px';
       
       circle.style.top = (H - th) + 'px';
       circle.style.left = tw + 'px';
             
 
        squad.style.top = H/2 + 'px';
       squad.style.left = W/2 + 'px';
       
       
       var tl=triangle.offsetLeft;
       var tt=triangle.offsetTop;
 
       l = 0 + tw;
       t = H - th -h;
 
            function moveByLine() {
 
         var ln,tn,ln1,tn1;
                         ln=l+r*Math.sin(p);
                         tn=t+r*Math.sin(p);
  
                      if(tn<0){p= -p;}
                      if (tn + h > H - th) { p = Math.PI;} 
                               
                       if((ln + l) < tl + 10)
                        {  
                           circle.style.left = triangle.offsetWidth + 'px';
                           circle.style.top = H - th - circle.offsetHeight; 
                           clearInterval(moveInterval);
                           return;
                        }
 
                         l=l+r*Math.cos(p); 
                         t=t+r*Math.sin(p);
 
                       circle.style.left=(l) + 'px'; 
                       circle.style.top=(t) + 'px';          
 
    } 
           var moveInterval = setInterval(moveByLine, 4); 
 
        </script>
</body> 
</html>

Последний раз редактировалось Amx1337; 23.04.2016 в 17:51. Причина: Не правильный заголовок
Amx1337 вне форума Ответить с цитированием
Старый 23.04.2016, 19:07   #2
pompiduskus
юзер как все
Участник клуба
 
Аватар для pompiduskus
 
Регистрация: 10.01.2012
Сообщений: 1,586
По умолчанию

Привет. Я делал давно такую штуку, визуализация "столкновений".

Там есть боковое, верхнее и нижнее столкновение. Думаю тебе поможет.
http://pompiduskus2.0fees.us/public/...simulator.html
<Дзен - Вся вселенная в тебе > | Резюме: https://ch3ll0v3k.github.io/CV/
pompiduskus вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Обчислить ординату центра массы площади квадрата yaroslav12345 Помощь студентам 2 17.11.2013 19:49
Екзель гонит, все сбилось в левый нижний угол SimSima Microsoft Office Excel 17 03.11.2010 10:38
Подскажите пожалуйста как сделать такую проверку орфографии Irinka87 Microsoft Office Word 1 10.12.2009 09:19
Пожалуйста, подскажите можно ли и как сделать в Excel расчёт процентов? magi Microsoft Office Excel 8 28.09.2007 22:48
КАК поместить ИКОНКУ программы в правый нижний угол панели(там где пуск)??? micaell Общие вопросы Delphi 5 21.02.2007 19:58