Bouton-image en javascript

Résolu/Fermé

hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 - 19 févr. 2008 à 14:01
hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 - 19 févr. 2008 à 17:56

Bonjour,

Je souhaiterais faire un lien en img (pas de probléme particulier jusqu'ici) mais j'aimerais que cette image change au passage de la souris. J'ai tout naturellement eut le reflex "Javascript". Le seul PB c'est que je ne connait pas ce language (oui je sais, il faut que je m'y mette, mais j'ai pas trop le temps en ce moment !).

Le lien se situ comme ceci:
<li><a href="accueil.html" target="corps"><img height="48" width="162" src="images/accueil_norm.png" alt="Accueil" border="0" onMouseUp="" /></a></li>

Question: Quesque je dois mettre dan ce onMouseUp="" ???

Merci de vos réponses...

A voir également:

Bouton-image en javascript
Image iso - Guide
Telecharger javascript - Télécharger - Langages
Acronis true image - Télécharger - Sauvegarde
Google recherche par image - Guide
Faststone image viewer - Télécharger - Visionnage & Diaporama

3 réponses

Réponse 1 / 3

OrionS Messages postés 55 Date d'inscription jeudi 7 février 2008 Statut Membre Dernière intervention 22 septembre 2008 39
19 févr. 2008 à 14:13

bonjour,

ci-dessous le code JS pour changer une image :

<script>
	function change()
	{
		document.images["img1"].src = "http://www.itligentia.com/wp-content/images/firefox.jpg";
	}
	function dechange()
	{
		document.images["img1"].src = "http://www.google.fr/intl/fr_fr/images/logo.gif";
	}
</script>

<a href="" onMouseOver="change()" onMouseOut="dechange()"><img src="http://www.google.fr/intl/fr_fr/images/logo.gif" name="img1"></a>

Réponse 2 / 3

Enax Messages postés 203 Date d'inscription lundi 11 février 2008 Statut Membre Dernière intervention 16 mars 2010 145
19 févr. 2008 à 14:21

C'est plus simple de passer par du CSS :

<li><a href="accueil.html" target="corps" class="bouton"></a></li>

.bouton
{
	display: block;
	width: 162px;
	height: 48px;
	background-image: url("image1.png");
}

.bouton:hover
{
	background-image: url("image2.png");
}

Réponse 3 / 3

hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 51
19 févr. 2008 à 17:56

Merci a tout les deux!

Je vais prendre les 2 méthodes !!!

A+

Discussions similaires

Retrouver l'image originale après avoir fait des modifications ?

Bouton ON OFF, O ou I ?

code couleur associé a une image

=Si la cellule A1 a du texte = B1 devient couleur

Discussions similaires

Newsletters