CodemySite_Web development

 About anolog clock, there are may ways do in Javascript.  The Math thorey is to calculate the degree depending on how many parts you want to divide. Because the circle is 360 degree. The basic is one minute equal to 60 seconds, one hour equal to 60 minutes.  First,  we need a clock on page,so there are several ways. 1.canvas Acording to W3C clock , it's clear that drawing a canvas is a good visial resolution. with getContext('2d'),and draw the clockface,number and time. The canvas drawing use the line ,stroke and fill a lot.  such as the drawFace(), the circle with radius Math,because the circle is 2PI*radius,and fill with color inside. 2.svg there is a way to use svg in Html. Like the code, the width and height can be set in html with svg. Demo more details here 3.html it's straight to set everything in the html.maybe it's not very decent code,but easy to understand for beginner. DEMO Github 24 hours display clock below layout every number and hand in html. A...

  Features: canvas rendering context,draw shape win score with if(),then can start again CODE Github  DEMO JAVASCRIPT reset all the variables and the ball in the center Then createCanvas With the blank canvas, render stuff on it The canvas should be with two paddles,middle dashed line,a ball and score display / draw shape with canvas  onMDN the middle dashed line build with canvas setLineDash() begin to animate()-->ball move and calculate the boundaries,then stop the game. repeat animations smoothly with requestAnimationFrame() css tricks    and  requestAnimationFrame() MDN the axis of ball changes based on speed If ball hit the wall,the speed reduce. If the ball hit the paddle,speed add. and calculate the score If player move,then computer move. If the score reach the winScore, the first reached win.And show the winner create the new overcome canvas. And can start game again with button click.