http://www.monjavascript.net

ACCUEIL
Contact
Rechercher
Insérez dans vos
  favoris

ACCUEIL DES
  VISITEURS

DATE & HEURE
EFFETS DE TEXTE
FENETRES
FORMULAIRES
IMAGES
MENUS
PRATIQUE
POP UP
DIVERS

Cours de javascript
Générer vos Fichiers
  CSS

Générer vos Meta-Tags
Description des Balises
  Meta

Les Codes Couleur
L'objet Math
Lissage De Prêt
Tableau d'Amortissement
un Multi-Moteurs de recherche sur Votre Site
Cryptez votre e-mail
  pour contrer le Spam

Cryptez vos Scripts
Moteurs de recherches
Référencement
Je Crée Mon Site
L'éditeur JavaScript


Un Rollover à 3 images

ou

Visionneuse fonctionnant au survol de la souris

Placer votre souris sur l'image ci-dessous les images défilent. Vous pouvez faire défiler autant d'images que vous le désirez

Insérez le code ci-dessous dans votre page entre les balises d'entête
<head> ..... </head>
( juste avant </head> )


<script language="JavaScript">
<!--
//PLF-http://www.monjavascript.net/
function objet() {
this.length = objet.arguments.length
for (var i = 0; i < this.length; i++) this[i+1] = objet.arguments[i]
}
var nom = new objet ("imaga.gif", "imagb.gif", "imagc.gif");
var numero = 1;
function changer() {
numero += 1;
if (numero == nom.length + 1) numero = 2;
document.image.src = "im/"+nom[numero];
roll=window.setTimeout('changer()',800)
}
function initial() {
if (numero != 1) numero = 1;
window.clearTimeout(roll);
document.image.src = "im/"+nom[numero];
}
function prechargimg() {
var doc=document;
if(doc.images){ if(!doc.precharg) doc.precharg=new Array();
var i,j=doc.precharg.length,x=prechargimg.arguments; for(i=0; i<x.length; i++)
if (x[i].indexOf("#")!=0){ doc.precharg[j]=new Image; doc.precharg[j++].src=x[i];}}
}
//-->
</script>
Corrigez comme suit

Nom des 3 images (pour la visionneuse indiquer toutes les images à faire défiler)
Chemin/ où trouver les images
Si vous souhaitez faire défiler l'image initial dans le rollover remplacez le 2 par 1 (à faire pour la visionneuse)
Temps d'apparition des images en millisecondes

Ensuite insérez le code ci-dessous dans la balise <body>

onLoad="prechargimg('im/imagb.gif','im/imagc.gif')"
chemin/nomimage.(gif,jpg,...) des 2ème et 3ème images (toutes sauf l'initiale pour la visionneuse)
EXEMPLE
<body bgcolor="#FFFFFF" background="im/fond.gif" onLoad="prechargimg('im/imagc.gif','im/imagb.gif')">
OU (s'il y a déjà une fonction ou autre de préchargée)
<body bgcolor="#FFFFFF" background="im/fond.gif" onLoad="tt_wonder();prechargimg('im/imagc.gif','im/imagb.gif')">

Puis insérez le code ci-dessous à l'endroit où les images vont défiler

<a href="#" onMouseOut="initial()" onMouseOver="changer()" ><img src="im/imaga.gif" width="200" height="194" border="0" name="image"></a>
Corrigez comme suit

chemin/nom_de_1ère_image.(gif,jpg,...) / largeur / hauteur en pixels
Vous pouvez créer un lien en remplaçant "#" par la page à atteindre "chemin/nompage.htm"

Pour la visionneuse
Si vous ne spécifiez pas la taille (width="200" height="194") les images s'affiche sous leur taille originale (pratique pour des images de tailles différentes).

 

Ce site vous a plu ? Vous avez trouvé le script que vous cherchiez ?
Faites en profiter vos visiteurs : insérez un lien sur votre site

 
 
Mon javascript    20-07-2018