begin process at 2012 05 28 14:44:43
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Effets

 > ROLLOVER SUR UNE IMAGE

ROLLOVER SUR UNE IMAGE


 Information sur la source

Note :
7,11 / 10 - par 9 personnes
7,11 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Effets Niveau :Débutant Date de création :05/02/2002 Date de mise à jour :05/02/2002 20:58:46 Vu :50 262

Auteur : OriOn

Ecrire un message privé
Commentaire sur cette source (15)
Ajouter un commentaire et/ou une note

 Description

C'est un petit code bien sympa qui vous permettra de faire un effet de rollover sur vos images...
CE N'EST PAS UN CODE JAVASCRIPT MAIS DU HTML !!!

Source

  • #1 --> votrepage.html correspond à votre lien
  • #2 --> img1.gif à votre première image
  • #3 --> img2.gif à l'image qui remplacera img1.gif au moment la souris passera sur l'image.
  • <a href="votrepage.html">
  • <img src="img1.gif" border="0"
  • onMouseOver="this.src='img2.gif'" onMouseOut="this.src='img1.gif'">
  • </a>
#1 --> votrepage.html correspond à votre lien
#2 --> img1.gif à votre première image
#3 --> img2.gif à l'image qui remplacera img1.gif au moment la souris passera sur l'image.

<a href="votrepage.html">
<img src="img1.gif" border="0"
onMouseOver="this.src='img2.gif'" onMouseOut="this.src='img1.gif'">
</a>
 

 Conclusion

Sur ce,
Bonne ProG.


 Sources du même auteur

OMBRE SUR UN TEXTE
DEGRADÉ DANS UNE PAGE EN HTML
MOVE BACKGROUND
EFFET D'OMBRE
BOUTON EN IMAGES

 Sources de la même categorie

Source avec Zip Source avec une capture BOUTON ROTATIF par kazma
Source avec Zip Source avec une capture SHOWMAPAREA par phidelum
DHTML IE FILTRE DÉGRADÉ (OUTIL HTML POUR DÉVELOPPEUR) par internetdev
Source avec Zip ANIMATION DU TEXTE par brennal
Source avec Zip Source avec une capture EFFET RAYONS DU SOLEIL par tefa24600

Commentaires et avis

Commentaire de Mikonyx le 17/02/2002 11:52:44

Oh put1!! orion!!! je t'aime...j'y arrivais pas! c pour l'interface de php-script-editor ;)

Commentaire de nitro120 le 17/08/2002 15:47:31

c'est du niveau 1 ça ???
non c'est du niveau 0 !
meme un bebe y arrive !

Commentaire de OriOn le 17/08/2002 18:56:10 administrateur CS

Bonjour,
ouais ba faudra le créer le niveau 0 alors :) car il existe pas dans le formulaire d'ajout de source.
Puis je te ferais dire que c'est toujours utile de trouver des sources qui nous ont TOUS bien aidés un jour, et qui en aideront bien encore. Mais bon, tu n'as sûrement jamais eu de problème toi, non ? Puis ô faites, toi qui à l'air si fort en js, pourquoi viens-tu consulter une source de ce genre ??
1. Reformules tes arguments si tu veux débattre une conversation.
2. Soit poli.

Cordialement,
OriOn.

Commentaire de chimelpremier le 30/03/2004 12:47:54

Il convient de précharger la 2ème image dans le head :

&lt;script type="text/javascript"&gt;
toto =new Image();
toto.src="img2.gif";
&lt;/script&gt;

Fallait-y-penser au this et les rappels ne sont pas inutiles, n'est-ce pas nitro.

Commentaire de hicksman le 23/04/2004 21:00:44

cette source date peut être amis comme koi elle est encore utile.
Merci!!  je galèrais pour trouver la soluce par moi-même.

Commentaire de beups le 20/07/2005 15:56:41

lol si c'est du java...

Commentaire de chimelpremier le 21/07/2005 09:13:13

C'est vrai que ça date, maintenant, il y a la technique des portes coulissantes qui fonctionne en css

Commentaire de peyo22 le 29/11/2005 21:12:10

certainement tres bien, mais
1/ inutilisable sous Firefox
2/ inutilisable sous IE sous xpSP2

bref, ca ne sert à rien :/
dommage

Commentaire de zorbam2 le 09/01/2006 23:45:56

je te remercie tous simplement , il faut quand même proposer quelque chose et tu l'a fais.
merci !!!!!

Commentaire de DuClik le 21/12/2006 15:00:59

>> peyo22
Je ne vois pas en quoi c'est inutilisable sous FF ou IE !!

T'as dû oublier une lettre quelque part ;)

Commentaire de tisha23 le 11/08/2007 20:19:06

En tout cas, pour moi çà marche sur firefox et explorer... MERCIIIIIIIIIIIIIIIIIIIIIIIIIi

Commentaire de masterhill le 18/09/2007 04:19:40

parfois les choses les plus simples dans la vie sont les meilleures !!
merci orion

Commentaire de midnnight le 09/06/2008 20:35:51

Bonjour à tous,
Une petite méthode hyper simple dépanne souvent ceux qui débutent et un "pense bête" n'est pas toujours inutile.
On a tous, au fin fond de notre pc, un petit script qui traine et qui peut aider quelqu'un qui cherche. Le script simple est à l'origine de tout.
N'hésitez donc pas à le mettre en ligne, même si il vous parrait inutile à votre travail, vous n'êtes pas seul sur terre...
Bien vu, c'est vrai, il y a css, mais quand on veut faire vite il y a aussi html.
C'est simple.
Bravo.

Commentaire de juntha le 11/03/2009 16:09:38 10/10

Bonjour à tous,
Débutant à gogo, en train de modifier un site dynamique qui malheureusement ne me laisse guère de grandes possibilités.
Quelle solution pour faire apparaitre la deuxième image à un notre emplacement sur la page et dans de nouvelles dimensions ?
Je ne peux utiliser que du html et n'ai pas accès au fichier css...
Merci d'avance
Eric

Commentaire de alain03 le 13/01/2011 19:10:37 10/10

Simple et efficace. Merci Orion!
Je me présente Alain03 je suis un vrai débutant,au niveau 0 et c'est avec ce genre de petit script que je progresse. Donc Merci encore à Orion et à toutes les personnes qui écrivent des scripts pour les débutants.

 Ajouter un commentaire




Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), 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

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,359 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales