+ 3

JavaScript animations

How do I get an object to move and then change directions as it’s moving

23rd Sep 2018, 5:40 PM
Zachary Burkholder
Zachary Burkholder - avatar
5 Antworten
23rd Sep 2018, 5:49 PM
Zachary Burkholder
Zachary Burkholder - avatar
+ 2
I want the green square to move over to the edge of the small blue square and then straight down then over to the left.
23rd Sep 2018, 5:55 PM
Zachary Burkholder
Zachary Burkholder - avatar
+ 2
I added a bit to make the square move down. You should be able to add the third and fourth bit to finish it. //calling the function in window.onload to make sure the HTML is loaded window.onload = function() { var hpos = 0; var vpos = 0; var st = 1; var box = document.getElementById('box'); var t = setInterval(move, 5); function move() { if (st==1){ if(hpos <100) { hpos += 1; box.style.left = hpos+'px'; } else { st=2; } } if (st==2){ if(vpos <100) { vpos += 1; box.style.top = vpos+'px'; } else { st=3; } } } }
23rd Sep 2018, 6:29 PM
davy hermans
davy hermans - avatar
+ 1
function move() { if(pos >= 150) { clearInterval(t); } else { pos += 1; box.style.left = pos+"px"; } }
19th Sep 2019, 8:13 PM
Dror Krief
Dror Krief - avatar
0
please post your code.
23rd Sep 2018, 5:45 PM
Ulisses Cruz
Ulisses Cruz - avatar