Beispiel für den HTML5-Leinwandrotationseffekt_HTML5-Tutorial-Fähigkeiten

Der Code von

keleyi.htm lautet wie folgt:

Kopieren Sie den Code Der Code lautet wie folgt: html Leinwand drehen Der Code von jb51.js lautet wie folgt:

Kopieren Sie den Code Der Code lautet wie folgt: /* * Funktion: Leinwandrotation */ (function(){ var canvas=null, context=null, angle =0; function resetCanvas(){ canvas=document.getElementById("jb51"); canvas.width=window.innerWidth; canvas.height=window.innerHeight; context=canvas.getContext(" 2d"); } function animate(){ context.save(); try{ //Canvas löschen context.clearRect (0, 0, Canvas. width, Canvas.height); //Legen Sie den Ursprung fest context.translate(canvas.width * 0.5, Canvas.height * 0.5); //Drehwinkel context.rotate(angle) ; //Füllfarbe festlegen context.fillStyle = "#FF0000"; //Rechteck zeichnen context.fillRect(-30, -30, 60 , 60); angle = 0.05 * Math.PI; } schließlich{ context.restore(); } } $(window).bind ("resize",resetCanvas). bind("reorient",resetCanvas); $(document).ready(function(){ window.scrollTo(0,1); resetCanvas(); setInterval(animate,40 ); }); })();