Des images qui tournent en arrière-plan en formant un cercle.
Démo : En cours...
Etape 1 : Ajouter dans le <HEAD> :
<script> <!-- // d'après un script de P. Gehrig - www.24fun.ch var imgsrc="star.gif" var x,y var step=5 var flag=1 var pause var timerbig var isbigcircle=1 var pause=50 var bigradius var start=1 var imgnumber=12 var xcenter var pi= Math.PI function initiate() { if (document.all) { xcenter=Math.floor(document.body.clientWidth/2) ycenter=Math.floor(document.body.clientHeight/2) } bigradius=ycenter bigcircle() } function handlerMM(e){ x = (document.layers) ? e.pageX : event.clientX y = (document.layers) ? e.pageY : event.clientY flag=1 } function onresizer() { clearTimeout(timerbig) initiate() } function bigcircle() { if (isbigcircle==1) { if (document.all) { for (i=1; i<=imgnumber; i++) { var thisspan = eval("document.all.span"+(i)+".style") thisspan.posLeft=((xcenter-20)*Math.cos(start*(pi/180)))+xcenter thisspan.posTop=((ycenter-20)*Math.sin(start*(pi/180)))+ycenter start=start+30 } } step=step+5 start=step timerbig=setTimeout("bigcircle()",pause) } else { isbigcircle=0 clearTimeout(timerbig) } } function prebigcircle() { isbigcircle=1 bigcircle() } // --> </script> <STYLE> .spanstyle { position:absolute; visibility:visible; top:-50px; } </STYLE>
Si vous changer d'image, il faudra mettre la nouvelle référence dans var imgsrc="star.gif" au début du script.
Etape 2 : Ajouter dans la balise <BODY> :
<body onLoad="initiate()">
Etape 3 : Ajouter juste après la <BODY> :
<script> <!-- if (document.all) { for (i=1;i<=imgnumber;i++) { document.write("<span id='span"+i+"' class='spanstyle'>") document.write("<img src='"+imgsrc+"'>") document.write("</span>") } document.onmousemove = handlerMM; document.onresize = onresizer; } // --> </script>
Etape 4 : Copier l'image suivante que vous placerez dans le répertoire de votre page :
