d2jsp
Log InRegister
d2jsp Forums > Off-Topic > Computers & IT > Programming & Development > Javascript Assignment: Modify This Code > 500fg
Add Reply New Topic New Poll
Member
Posts: 14,925
Joined: Jan 3 2008
Gold: 135,879.75
May 23 2019 08:40pm
https://jsbin.com/wakitog/4/edit?html,js,output

1. Make the animation run for only 10 seconds.

2. Currently the circles bounce within a 400 by 400 box. I would like the bounce to happen instead within a 400 by 400 circle.

3. Create a button that allows for the animation to pause.



This post was edited by kdog3682 on May 23 2019 08:48pm
Trade Moderator
Posts: 26,718
Joined: Dec 20 2005
Gold: 82,000.00
Trader: Trusted
May 24 2019 12:58am
1. https://www.w3schools.com/jsref/prop_style_animationduration.asp - Read on how to make a duration to your animation.
2.
Code
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
var centerX = canvas.width / 2;
var centerY = canvas.height / 2;
var radius = 70;

context.beginPath();
context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
context.fillStyle = 'green';
context.fill();
context.lineWidth = 5;
context.strokeStyle = '#003300';
context.stroke();


3. read this
https://stackoverflow.com/questions/31579700/how-to-make-a-single-button-act-as-a-start-and-stop-button-in-javascript
Go Back To Programming & Development Topic List
Add Reply New Topic New Poll