Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

ARRIERE-PLAN QUI TOURNE !


Information sur la source

Catégorie :Trucs Amusants Classé sous : tourne, rotation, image, arriere, plan Niveau : Initié Date de création : 09/09/2005 Vu / téléchargé: 12 557 / 797

Note :
7,6 / 10 - par 5 personnes
7,60 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10

Commentaire sur cette source (8)
Ajouter un commentaire et/ou une note

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 !
 

Fichier Zip

Pour les "Membres Club", vous pouvez télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip

Commentaires et avis

signaler à un administrateur
Commentaire de linkinpar236737 le 10/09/2005 09:50:01

ça ne fonctionne pas sous Mozilla.

signaler à un administrateur
Commentaire de bultez le 10/09/2005 10:00:45

très intéressant,utile,
ça ouvre des horizons...
bravo.               @+

signaler à un administrateur
Commentaire de terrible le 10/09/2005 10:38:41

bonjour superbe animation
Pourriez-vous expliciter cette ligne de code
<OBJECT classid=CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6 id=spinny
style="HEIGHT: 100%; WIDTH: 100%">

signaler à un administrateur
Commentaire de glork le 10/09/2005 23:12:42

Merci pour vos commentaires.
linkinpar236737, effectivement, ca marche juste sur MSIE
terrible - <OBJECT classid=CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6 id=spinny
style="HEIGHT: 100%; WIDTH: 100%">
...
...
..
</object>
C'est ce qui fait que l'ecran tourne (bien-sur c'est defini dans head aussi. Si tu veut modifier quelque chose la-dedans, c'est la couleur de chaque branche qui tourne. Comme dans <PARAM NAME="Line0009" VALUE="SetFillColor(0,0,150)"> , tu peut modifier 0,0,150 par une autre couleur RGB, comme 0,0,250 ce qui donnerait un bleu clair. N'efface pas le "<object> parce que sinon ton ecran ne vas pas tourner il vas rester un ecran normal avec la couleur que t'avait choisis dans "<body bgcolor="

signaler à un administrateur
Commentaire de terrible le 11/09/2005 09:48:53

J'ai trouvé sur le forum une autre animation reposant sur le même principe activeX
Sais-tu comment obtenir la liste des activesX disponibles dans window xp avec leurs paramètres de règlages

signaler à un administrateur
Commentaire de algori le 11/09/2005 12:20:41

Salut,
C'est sympa.
Juste une remarque : ça bouffe de la puissance, mon process oscille entre 99% et 100% (1,5 GHz)
@++

signaler à un administrateur
Commentaire de glork le 11/09/2005 15:35:28

C'est normal, plus que tu met d'effets, plus que c'est lent.
Si t'as des probl. avec ton ordi, je ne te conseillerait pas d'entrer sur des pages de meme !

signaler à un administrateur
Commentaire de logiciels_thiery le 14/09/2005 11:51:20

Super !
J'avais déjà vu ça mais avec mois de code... il y a très très longtemps... j'ai pas enregistré le code !
Sinon c'est bien mais c'est conseillé pour des images basse résolutions ! Car même avec mon processeur AMD 64 4000+ (le tout dernnié quoi !)utilisation du CPU 86% !
8/10

Ajouter un commentaire

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&#232;re plan sur pratiquement toutes les pages de mon site Comment faire pour que celel ci soit non mltip Arriere plan = fct(résolution écran) [ par Fab117 ] Salut,Existe-il un script qui scanne la r&#233;solution de l'&#233;cran de l'internaute est choisi l'image d'arri&#232;re plan ("arriere-plan 800 x 60 select en arriere plan [ par billy21121 ] Bonjour,j'utilise actuellement un calendrier en javascript et CSS mais le problème est que lorsque j'utilise une balise select, celle ci passe au dess rotation d'image [ par WebInitiation ] Bonjour j'ai un petit soucis.En fait ce que je voudrais faire c'est afficher un logo portable sur mon site.(Un roulement).Pour ce faire j'ai essayer p mettre une image au premier plan de la page web [ par ndubien ] Bonjour,Je cherche à savoir comment faire apparaître une image devant une autre ou même devant un texte?Je veux que l'image au premier plan puisse cha 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 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 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&#232;mes, mais sous IE la popup s'affiche en


Nos sponsors

Sondage...

CalendriCode

Décembre 2008
LMMJVSD
1234567
891011121314
15161718192021
22232425262728
293031    

Consulter la suite du CalendriCode

Téléchargements

Logiciels à télécharger sur le même thème :



Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel BAÏSE, Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,437 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.