Форум программистов
 
Контакты: о проблемах с регистрацией, почтой и по другим вопросам пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail.

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

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


Донат для форума - использовать для поднятия настроения себе и модераторам

А ещё здесь можно купить рекламу за 25 тыс руб в месяц! ) пишите сюда - alarforum@yandex.ru

Ответ
 
Опции темы
Старый 23.04.2016, 18:50   #1
Amx1337
 
Регистрация: 23.04.2016
Сообщений: 4
Репутация: 10
По умолчанию Движение картинки по траектории 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 в 18:51. Причина: Не правильный заголовок
Amx1337 вне форума   Ответить с цитированием
Старый 23.04.2016, 20:07   #2
pompiduskus
юзер как все
Профессионал
 
Аватар для pompiduskus
 
Регистрация: 10.01.2012
Адрес: земля
Сообщений: 1,575
Репутация: 700

icq: 446.452.423
По умолчанию

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

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

Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход

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


05:18.


Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.