Accueil > > > ARRIERE-PLAN QUI TOURNE !
ARRIERE-PLAN QUI TOURNE !
Information sur la source
Description
Superbe script qui fait tourner un arrière-plan dans le sens des aiguilles d'une montre ! On peut configurer quelques variables dans le script : - la vitesse de rotation (plus élevé égal plus vite) dans dspeed=x. - Avec un chiffre négatif, on inverse le sens de rotation. - vous pouvez jouer avec la valeur de dspin=x. Vous obtiendrez alors - une rotation dans l'espace. - la premiere couleur de la page est deternimée dans la balise body (ici #000080) - la seconde couleur de l'effet , ici un bleu plus clair, en notation fonctionnelle rgb (soit 3 nombres entiers compris entre 0 et 255) dans tous les SetFillColor(0,0,150). Donc ceux qui veulent changer de couleur, vous le pouvez ici.
Source
- <html>
- <head>
- <SCRIPT>
- // Script par Glork !
- // La vitesse de rotation (+ = +vite)
- // -x égal sens inverse des aiguilles
- dspeed=1;
- // Autre valeur égal rotation 3D
- dspin=0;
- ////////////////////////////////////////////////
- drev="";
- ddirec="up"
- drun="no"
- dflip="left"
-
- function spinit() {
- spinny.rotate(0,dspin,drev + dspeed);
- window.setTimeout("spinit()", 1, "JavaScript");
- }
-
- function run() {
- if (ddirec=="up") {
- dspeed++
- if (dspeed == 10) { ddirec="down" }
- }
- else {
- dspeed--
- if (dspeed == 1) { ddirec="up" }
- }
- var runtimer = setTimeout('run()',100);
- }
-
- function chspeed(nspeed) {
- if (drun == "no") { dspeed=nspeed }
- }
-
- function spin() {
- if (dspin == "0") { dspin = "5" }
- else { dspin = "0" }
- }
-
- function reverse() {
- if (drev == "") { drev = "-" }
- else { drev = "" }
- }
-
- function runspeed() {
- if (drun == "yes") { drun = "no"; clearTimeout('runtimer'); }
- else { drun = "yes"; var runtimer = setTimeout('run()',100); }
- }
-
- function flipper() {
- if (dflip == "left") {
- layout.style.filter = 'fliph(enabled=1)';
- dflip="right";
- layouttext.style.left = "62%";
- }
- else { layout.style.filter = 'fliph(enabled=0)'; dflip="left"; layouttext.style.left = "1%"; }
- }
- </SCRIPT>
- <title> ma page... </title>
- </head>
- <BODY text="#FFFFFF" bgcolor="#000080" link="#FFFFFF" vlink="#FFFFFF" alink="#FF0000" leftMargin="0" topMargin="0" marginleft="0" margintop="0" onload=spinit()>
- <SCRIPT>
- document.write("<div style='position: absolute; top: 0; left: 0; HEIGHT:100%; WIDTH:100%;'>");
- </SCRIPT>
- <OBJECT classid=CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6 id=spinny
- style="HEIGHT: 100%; WIDTH: 100%">
- <PARAM NAME="Line0001" VALUE="SetFillStyle(1)">
- <PARAM NAME="Line0002" VALUE="SetLineColor(0,0,150)">
- <PARAM NAME="Line0003" VALUE="SetFillColor(0,0,150)">
- <PARAM NAME="Line0004" VALUE="Pie(-725,-725,1450,1450,0,30,342)">
- <PARAM NAME="Line0005" VALUE="SetFillColor(0,0,150)">
- <PARAM NAME="Line0006" VALUE="Pie(-725,-725,1450,1450,0,15,18)">
- <PARAM NAME="Line0007" VALUE="SetFillColor(0,0,150)">
- <PARAM NAME="Line0008" VALUE="Pie(-725,-725,1450,1450,0,5,54)">
- <PARAM NAME="Line0009" VALUE="SetFillColor(0,0,150)">
- <PARAM NAME="Line0010" VALUE="Pie(-725,-725,1450,1450,0,35,95)">
- <PARAM NAME="Line0011" VALUE="SetFillColor(0,0,150)">
- <PARAM NAME="Line0012" VALUE="Pie(-725,-725,1450,1450,0,20,130)">
- <PARAM NAME="Line0013" VALUE="SetFillColor(0,0,150)">
- <PARAM NAME="Line0014" VALUE="Pie(-725,-725,1450,1450,0,3,140)">
- <PARAM NAME="Line0015" VALUE="SetFillColor(0,0,150)">
- <PARAM NAME="Line0016" VALUE="Pie(-725,-725,1450,1450,0,30,180)">
- <PARAM NAME="Line0017" VALUE="SetFillColor(0,0,150)">
- <PARAM NAME="Line0018" VALUE="Pie(-725,-725,1450,1450,0,45,234)">
- <PARAM NAME="Line0019" VALUE="SetFillColor(0,0,150)">
- <PARAM NAME="Line0020" VALUE="Pie(-725,-725,1450,1450,0,20,270)">
- <PARAM NAME="Line0021" VALUE="SetFillColor(0,0,150)">
- <PARAM NAME="Line0022" VALUE="Pie(-725,-725,1450,1450,0,10,306)">
- </OBJECT>
- <DIV id=layout style="HEIGHT: 100%; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 100%">
- Votre page ici !
- </DIV>
- </body>
- </html>
<html>
<head>
<SCRIPT>
// Script par Glork !
// La vitesse de rotation (+ = +vite)
// -x égal sens inverse des aiguilles
dspeed=1;
// Autre valeur égal rotation 3D
dspin=0;
////////////////////////////////////////////////
drev="";
ddirec="up"
drun="no"
dflip="left"
function spinit() {
spinny.rotate(0,dspin,drev + dspeed);
window.setTimeout("spinit()", 1, "JavaScript");
}
function run() {
if (ddirec=="up") {
dspeed++
if (dspeed == 10) { ddirec="down" }
}
else {
dspeed--
if (dspeed == 1) { ddirec="up" }
}
var runtimer = setTimeout('run()',100);
}
function chspeed(nspeed) {
if (drun == "no") { dspeed=nspeed }
}
function spin() {
if (dspin == "0") { dspin = "5" }
else { dspin = "0" }
}
function reverse() {
if (drev == "") { drev = "-" }
else { drev = "" }
}
function runspeed() {
if (drun == "yes") { drun = "no"; clearTimeout('runtimer'); }
else { drun = "yes"; var runtimer = setTimeout('run()',100); }
}
function flipper() {
if (dflip == "left") {
layout.style.filter = 'fliph(enabled=1)';
dflip="right";
layouttext.style.left = "62%";
}
else { layout.style.filter = 'fliph(enabled=0)'; dflip="left"; layouttext.style.left = "1%"; }
}
</SCRIPT>
<title> ma page... </title>
</head>
<BODY text="#FFFFFF" bgcolor="#000080" link="#FFFFFF" vlink="#FFFFFF" alink="#FF0000" leftMargin="0" topMargin="0" marginleft="0" margintop="0" onload=spinit()>
<SCRIPT>
document.write("<div style='position: absolute; top: 0; left: 0; HEIGHT:100%; WIDTH:100%;'>");
</SCRIPT>
<OBJECT classid=CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6 id=spinny
style="HEIGHT: 100%; WIDTH: 100%">
<PARAM NAME="Line0001" VALUE="SetFillStyle(1)">
<PARAM NAME="Line0002" VALUE="SetLineColor(0,0,150)">
<PARAM NAME="Line0003" VALUE="SetFillColor(0,0,150)">
<PARAM NAME="Line0004" VALUE="Pie(-725,-725,1450,1450,0,30,342)">
<PARAM NAME="Line0005" VALUE="SetFillColor(0,0,150)">
<PARAM NAME="Line0006" VALUE="Pie(-725,-725,1450,1450,0,15,18)">
<PARAM NAME="Line0007" VALUE="SetFillColor(0,0,150)">
<PARAM NAME="Line0008" VALUE="Pie(-725,-725,1450,1450,0,5,54)">
<PARAM NAME="Line0009" VALUE="SetFillColor(0,0,150)">
<PARAM NAME="Line0010" VALUE="Pie(-725,-725,1450,1450,0,35,95)">
<PARAM NAME="Line0011" VALUE="SetFillColor(0,0,150)">
<PARAM NAME="Line0012" VALUE="Pie(-725,-725,1450,1450,0,20,130)">
<PARAM NAME="Line0013" VALUE="SetFillColor(0,0,150)">
<PARAM NAME="Line0014" VALUE="Pie(-725,-725,1450,1450,0,3,140)">
<PARAM NAME="Line0015" VALUE="SetFillColor(0,0,150)">
<PARAM NAME="Line0016" VALUE="Pie(-725,-725,1450,1450,0,30,180)">
<PARAM NAME="Line0017" VALUE="SetFillColor(0,0,150)">
<PARAM NAME="Line0018" VALUE="Pie(-725,-725,1450,1450,0,45,234)">
<PARAM NAME="Line0019" VALUE="SetFillColor(0,0,150)">
<PARAM NAME="Line0020" VALUE="Pie(-725,-725,1450,1450,0,20,270)">
<PARAM NAME="Line0021" VALUE="SetFillColor(0,0,150)">
<PARAM NAME="Line0022" VALUE="Pie(-725,-725,1450,1450,0,10,306)">
</OBJECT>
<DIV id=layout style="HEIGHT: 100%; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 100%">
Votre page ici !
</DIV>
</body>
</html>
Conclusion
Malheureusement ca marche que sur IE :( Si vous avez des commentaires, n'hesitez pas !
Sources du même auteur
Sources de la même categorie
Commentaires et avis
Discussions en rapport avec ce code source dans le forum
arriere plan de mon site : help [ par fairylullaby ]
Salut je voudrais mettre une image en arrière plan sur pratiquement toutes les pages de mon site Comment faire pour que celel ci soit non mltip
Arriere-plan image changeante on refresh adaptee a l ecran du client [ par pearlp ]
Bonsoir ! Voiala ca fais 5 jours que j'essaie de trouver un scripte qui me permetterai d avoir une nouvelle image arriere plan a chaque rafraichissem
Mon arriere plan joue a cache cache!!!! [ par sebing ]
Bonsoir,Je fais mes pages à l'aide de Frontpage, j'ai un probleme mon image d'arriere plan ne s' affiche pas dans :l'apercu du navigateur.Pourtan
faire bouger l'arrière plan d'un <div> [ par johnnylechat ]
Bonjour à tous, Je vous expose mon problème : pour un menu, je dispose de liens définis de la manière suivante dans le css : "a {width:100%; height
POPUP overlib en arriere plan (IE) [ par medmen ]
Bonjour; J'utilise overlib pour afficher une popup, bref,sous firefox(1.5) la popup s'affiche sans problèmes, mais sous IE la popup s'affiche en
arriere plan [ par gazalii ]
bonjourj'ai une div nome layer_alpha<div id="layer_alpha" style="position: absolute; left: 0pt; top: 0pt; width: 100%; height: 100%; visibility: hi
comment manipuler une image ? (deplacement + rotation) [ par franco_se ]
bonjours je voudrais savoir comment faire pour manipuler une image, a savoir la deplacer, et lui appliquer une rotation. Mon but étant en fait de depl
Faire une ROTATION d'une image avec HTML ou JAVASCRIPT ? [ par maxxcbenny ]
Bonjour,Quelqu'un connait-il le moyen de faire subir une rotation à une image dans un navigateur web ? Avec un angle libre de 0° à 360° évidement ?Par
Changer l'image d'arrière plan [ par cyBerpOmmer ]
voila, j'ai un site à réaliser et il faut que l'image en arrière plan change. Je ne voudrai pas avoir à recharger la page mais simplement avoir à exec
HTML : changer image arriere plan tableau au passage souris [ par ju0123456789 ]
Bonjour,Je voudrais savoir comment peut-on faire changer l'image d'arrière plan d'un tableau (page HTML) au passage de la souris n'importe où sur le
|
Derniers Blogs
SESSION SILVERLIGHT 5 3D : SLIDES ET DEMOSSESSION SILVERLIGHT 5 3D : SLIDES ET DEMOS par Groc
Durant les techdays, j'ai eu le plaisir d'animer une session sur Silverlight 5 et la 3D avec Simon Ferquel. Comme promis, voici nos slides et mes démos (celles avec le viper BSG) ici et là. Pour mémoire, les démos utilisent toutes le viper BSG...
Cliquez pour lire la suite de l'article par Groc [TECHDAYS 2012] SESSION WEBMATRIX 2 : LE COUTEAU SUISSE GRATUIT POUR VOS DéVELOPPEMENTS WEB - SLIDES[TECHDAYS 2012] SESSION WEBMATRIX 2 : LE COUTEAU SUISSE GRATUIT POUR VOS DéVELOPPEMENTS WEB - SLIDES par gpommier
Suite à la session que j'ai présenté sur WebMatrix 2, vous pouvez trouver les slides ici, ainsi que les démos en packages nuget : démos1 et démos2 J'en profite pour remercier chaleureusement tous ceux qui sont venus très nombreux à cette sess...
Cliquez pour lire la suite de l'article par gpommier [SHAREPOINT] LES SESSIONS TECHDAYS 2012.[SHAREPOINT] LES SESSIONS TECHDAYS 2012. par Patrick Guimonet
Voici donc pour ceux qui n'ont pas pu venir, ou ceux qui n'ont pas pu toutes les suivre la liste des sessions SharePoint aux TechDays 2012, que je mettrais à jour dès que les liens des vidéo seront disponibles. Ou ici : http...
Cliquez pour lire la suite de l'article par Patrick Guimonet TECHDAYS PARIS 2012 : SESSION PLEINIèRE JOUR 3TECHDAYS PARIS 2012 : SESSION PLEINIèRE JOUR 3 par ROMELARD Fabrice
Speaker: Bernard Ourghanlian Cette session est comme chaque jour transmise en live par BrainSonic, et j'ai donc suivi cette troisième pleinière par ce moyen sur mon iPad . Elle est dédiée comme chaque année à la mise en perspective de l'é...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice MISHRA READER : UN LECTEUR RSS TRèS ZUNE STYLE EN OPEN SOURCE !MISHRA READER : UN LECTEUR RSS TRèS ZUNE STYLE EN OPEN SOURCE ! par Vko
Hier durant une session dédiée aux Techdays 2012, j'ai eu le plaisir d'annoncer la sortie de la Béta 2 de Mishra Reader. C'est quoi ? Pour les utilisateurs, c'est une vraie expérience de lecture de flux RSS sur Windows. Rien à voir avec les produit...
Cliquez pour lire la suite de l'article par Vko
Logiciels
Tribler (2012)TRIBLER (2012)Tribler est un client pair à pair (P2P/Peer-to-Peer) open source avec la capacité de regarder des... Cliquez pour télécharger Tribler OneSwarm (2012)ONESWARM (2012)Le peer-to-peer qui protège votre vie privée, c'est OneSwarm.
Ce logiciel de peer-to-peer crypté... Cliquez pour télécharger OneSwarm PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V8.4)PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V8.4)PONAMEDIA TV DEVIENS HELLLOOO FLASH
LA TV SUR VOTRE ORDINATEUR.
Toute une plateforme Multi... Cliquez pour télécharger PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO Academy System (17.2.1.0)ACADEMY SYSTEM (17.2.1.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System Easy-Planning (1.0.0.1)EASY-PLANNING (1.0.0.1)Basé sur les mêmes principes que MyPlanning, Easy-Planning permet de créer des plannings sous la ... Cliquez pour télécharger Easy-Planning
|