Mixing HTML5 Video and Canvas - HTML5 Canvas

HTML and CSS Reference

In-Depth Information

}

var

var numVideos = 12 ;

var

var maxSpeed = 10 ;

var

var videos = new

new Array ();

var

var tempvideo ;

var

var tempX ;

var

var tempY ;

var

var tempSpeed ;

var

var tempAngle ;

var

var tempRadians ;

var

var tempXunits ;

var

var tempYunits ;

var

var theCanvas = document . getElementById ( "canvasOne" );

var

var context = theCanvas . getContext ( "2d" );

videoElement . play ();

for

for ( var

var i = 0 ; i < numVideos ; i ++ ) {

tempX = 160 ;

tempY = 190 ;

tempSpeed = 5 ;

tempAngle = Math . floor ( Math . random () * 360 );

tempRadians = tempAngle * Math . PI / 180 ;

tempXunits = Math . cos ( tempRadians ) * tempSpeed ;

tempYunits = Math . sin ( tempRadians ) * tempSpeed ;

tempvideo = { x : tempX , y : tempY , width : 180 , height : 120 ,

speed : tempSpeed , angle : tempAngle ,

xunits : tempXunits , yunits : tempYunits }

videos . push ( tempvideo );

}

function

function gameLoop () {

window . setTimeout ( gameLoop , 20 );

drawScreen ();

}

gameLoop ();

}

< /script>

</head>

<body>

<div

HTML5 Canvas

Search WWH ::

Custom Search

Home