Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.10.2019, 17:20
Новичок на форуме
Отправить личное сообщение для TeslaGR Посмотреть профиль Найти все сообщения от TeslaGR
 
Регистрация: 22.10.2019
Сообщений: 1

HELP с перемещение фигур!
Приветствую! Помогите разобратья пожалуйста. Есть такой код:

HTML
<div>
<img id="tr1"/>
</div>

<div>
<img id="tr2"/>
</div>

<div>
<img id="tr3"/>
</div>



CSS
Код:
#tr1 { position: absolute;
width: 0;
  	height: 0;
    border-left: 60px solid transparent;
  	border-right: 60px solid transparent;
  	border-bottom: 100px solid red;
    margin-left:60px;
   }

#tr2 { position: absolute;
width: 0;
  	height: 0;
    border-left: 60px solid transparent;
  	border-right: 60px solid transparent;
  	border-bottom: 100px solid red;
    margin-top:100px;
}

#tr3 { position: absolute;
width: 0;
  	height: 0;
    border-left: 60px solid transparent;
  	border-right: 60px solid transparent;
  	border-bottom: 100px solid red;
    margin-top:100px;
    margin-left:120px;
}
JS
var t = 0;
var tt = 0.02;
var r = 50;

function moveit1() {
    t += tt;

    
    var xcenter = 100;
    var ycenter = 100;
    var newLeft = Math.floor(xcenter + (r * Math.cos(t)));
    var newTop = Math.floor(ycenter + (r * Math.sin(t)));
    $('#tr1').animate({
        top: newTop,
        left: newLeft,
    }, 1, function() {
        moveit1();
    });
}

function moveit2() {
    t += tt;

  	 var xcenter = 100;
    var ycenter = 100;
    var newLeft = Math.floor(xcenter + (r * Math.cos(t)));
    var newTop = Math.floor(ycenter + (r * Math.sin(t)));
    $('#tr2').animate({
        top: newTop,
        left: newLeft,
    }, 1, function() {
        moveit2();
    });
}

function moveit3() {
    t += tt;

    var xcenter = 100;
    var ycenter = 100;
    var newLeft = Math.floor(xcenter + (r * Math.cos(t)));
    var newTop = Math.floor(ycenter + (r * Math.sin(t)));
    $('#tr3').animate({
        top: newTop,
        left: newLeft,
    }, 1, function() {
        moveit3();


Тут получается 3 треугольника, которые организуют один большой треугольник и вся эта конструкция вращается по кругу. А нужно, чтобы центры этих треугольников вращались под одной круговой траектории.
Вот так...
Изображения:
Тип файла: gif Triangle.gif (10.8 Кб, 10 просмотров)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Перемещение элемента внутри блока milkman Events/DOM/Window 4 25.07.2017 21:01
Изменение размера и перемещение элементов Nupster Элементы интерфейса 2 12.08.2014 19:38
Перемещение по якорям по событию скролла Paulls Events/DOM/Window 1 20.06.2014 03:51
Перемещение объектов, последовательность событий prizrak39 Events/DOM/Window 3 19.11.2012 12:42
реакция на перемещение мыша по строкам в SELECT VovaLun Events/DOM/Window 0 16.12.2009 13:20