Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <canvas id="ctx" width="500" height="500" style="border:1px solid #000000;"></canvas>
- <script>
- var ctx = document.getElementById("ctx").getContext("2d");
- ctx.font = '30px Arial';
- var x = 50;
- var spdX = 30;
- var y = 40;
- var spdY = 5;
- setInterval(update,500);
- function update(){
- x += spdX;
- y += spdY;
- ctx.fillText('P',x,y);
- console.log('hello',x);
- if(x > 500){
- console.log('Out of Bounds');
- }
- }
- /* Comment Section
- //1. Modify Settings =
- ctx.font = '30px Arial'; //Font used
- ctx.fillStyle = 'red'; //Color of the text and forms
- ctx.globalAlpha = 0.5; //Transparency 0 = invisble, 1 = visible
- //2. Draw something ()
- ctx.fillText('Hello',50,50); //Write text ... ctx.fillText('text',x,y);
- ctx.fillRect(50,50,100,100); //Draw rectangle ... ctx.fillRect(startX,startY,width,height);
- ctx.clearRect(75,75,100,100); //Clear Canvas ... ctx.fillRect(startX,startY,width,height);
- x += spdX; same than x = x +spdX
- Debugger:
- F12
- Breakpoint = Code stops when reaches this line if console is opened
- Console = Get the value of variable + Message with console.log('text');
- End of Comment Section */
- </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement