Cet article partage l'animation de chargement dynamique de la minuterie Canvas pour votre référence. Le contenu spécifique est le suivant
<! Doctype html> <html> <head lang = "en"> <meta charset = "utf-8"> <title> </title> <style> </ style> </ad> <body> <canvas id = "canvas"> Votre navigateur ne prend pas en charge la technologie Canvas </olevas> <script> var c = document.getElementyid (Canvas '); var ctx = c.getContext ('2d'); CTX.TRANSLATE (C.Width / 2, C.Height / 2); // Fonction de circles enveloppés statistiquement enveloppés Create () {pour (var i = 1; i <9; i ++) {if (i == 1) {ctx.beginPath (); ctx.arc (0, -30, 5, 0, 2 * math.pi); ctx.fillStyle = '# f0f'; ctx.fill (); } else {ctx.beginpath (); ctx.arc (0, -30, 5, 0, 2 * math.pi); ctx.strokestyle = '# 000'; ctx.stroke (); } ctx.rotate (math.pi * 45/180); }} // commutateur setInterval (function () {ctx.clearrect (-C.Width / 2, -C.Height, C.Width, C.Height); Create (); ctx.rotate (math.pi * 45/180);}, 300); // Close de clôture à clôture setTimeout (function () {c.style.display = 'Aucun';}, 12200); // </ script> </ body> </html>Ce qui précède est tout le contenu de cet article. J'espère que cela sera utile à l'apprentissage de tous et j'espère que tout le monde soutiendra davantage Wulin.com.