begin process at 2012 05 26 16:58:19
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

CSS

 > 

Général

 > 

Changement d'image en passant la souris sur un bouton


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

Changement d'image en passant la souris sur un bouton

vendredi 20 mars 2009 à 15:54:13 | Changement d'image en passant la souris sur un bouton

dav40

Bonjour,
je suis à la recherche d'un script pour afficher des images en passant le souris sur différents bouton.

Voici ce que j'ai:
          <p><img src="images/email_petit.png" name="img_1" width="94" height="99" id="img_2" style=" float: left ">
                </p>
             </tr>
          <td><a id="Lien" href="javascript:void(document.getElementById('img_2').src='images/logo_vue.png');" ></tr>

mais ça me fonction pas !

Y-a-t-il quelqu'un qui à un script ?

Merci
vendredi 20 mars 2009 à 16:22:42 | Re : Changement d'image en passant la souris sur un bouton

Bul3

Membre Club


Bonjour,
<img src=....
...onmouseover="this.toto=this.src; this.src='ce que tu veux'" onmouseout="this.src=this.toto;"...

Cordialement [mon Site] [M'écrire] Bul
samedi 21 mars 2009 à 13:03:47 | Re : Changement d'image en passant la souris sur un bouton

kazma

Administrateur CodeS-SourceS
bonjour
a la place de name met id
name="img_1"
 id ="img_1"

samedi 21 mars 2009 à 16:03:32 | Re : Changement d'image en passant la souris sur un bouton

dav40

bjr,
merci pour votre aide.
avec les éléments que vous m'avez passé j'arrive à ça:

         <table width="122" height="280" cellpadding="0" cellspacing="0"><tr>
         <td width="120" height="99"><img src="images_1" width="94" height="99" id="imgae_1" ><tr>
         <td height="44"><tr>
         <a id="image_2" href="onmouseover="this.toto=this.src; this.src="image_2" onmouseout="this.src=this.toto;" ><tr>
         <td height="54"></table>

Mais ça ne fonctionne pas, j'ai du faire une erreur mais où !!!

Merci


samedi 21 mars 2009 à 16:18:38 | Re : Changement d'image en passant la souris sur un bouton

Bul3

Membre Club

_ tu as des erreurs de syntaxe !
    le navigateurs se pomme dans tes guillemets

_ ton lien n'est pas valide : par des texte et pas de </a>
   il te manque des </td>, des </tr>.... !!!
 
_ si dans  href, il faut faire href="javascript:...."

ensuite c'est donc image1 qu'il faut modifier
en passant sur le lien ?
si oui :
ne mets pas cela dans le href
mais dans onmouseover+onmouseout
et remplace les this par document.getElementById('imgae_1')
( et pas image_1 !  ou change l'ID )

ch'tiot exemple....

<body>
    <table cellpadding="0" cellspacing="0">
            <tr>
                <td ><img src="Chauve Souris.gif" id="imgae_1" /></td></tr>
             <tr><td>
                <a id="image_2"     onmouseover="des();"
                                        onmouseout="par();" >lien</a></td></tr>
    </table>
    <script>
        var i=document.getElementById("imgae_1");
        function des()
        {    i.toto=i.src;
            i.src="carte_conso_pt.gif";
        }
        function par()
        {    i.src=i.toto;    }
    </script>

</body>
samedi 21 mars 2009 à 16:23:42 | Re : Changement d'image en passant la souris sur un bouton

Bul3

Membre Club
attention, car tel que j'ai fais, si les tailles des images
différent par exemple, l'affichage de la nouvelle image, va déplacer
le lein et donc provoquer le mouseout, qui remettra la 1ère image
et qui provoquera le mouseover... boucle do infernale !

samedi 21 mars 2009 à 16:25:06 | Re : Changement d'image en passant la souris sur un bouton

Bul3

Membre Club
comme ça :


    <table cellpadding="0" cellspacing="0">
             <tr><td>
                <a id="image_2"     onmouseover="des();"
                                    onmouseout="par();" >lien</a></td></tr>
            <tr>
                <td ><img src="Chauve Souris.gif" id="imgae_1" /></td></tr>
    </table>

plus le souci ! o)

samedi 21 mars 2009 à 16:52:28 | Re : Changement d'image en passant la souris sur un bouton

dav40

Je debut et là je suis perdu dans ce petit script

voici le lien de ma page sur le net: www.jet-evasion.fr/location_jets.htm

j'ai les cadre avec les explications, car je ne sais pas comment et ou le placer le script

merci encore de ton aide
 
dimanche 22 mars 2009 à 17:20:07 | Re : Changement d'image en passant la souris sur un bouton

kazma

Administrateur CodeS-SourceS
bonjour
essai ce script

<html>
<head>
<script type="text/javascript">

 function change(imageaaffiche){
document.getElementById(coucou).src=imageaaffiche
}
</script>
</head>
<body>
<img id ='coucou' src ='image.jpg'>
<br>
<img src ='minia.jpg onclick="change('image.jpg')" >
<img src ='minib.jpg onclick="change('image2.jpg')">
<img src ='minic.jpg onclick="change('image3.jpg')">
</body>
</html>

dimanche 22 mars 2009 à 17:21:34 | Re : Changement d'image en passant la souris sur un bouton

kazma

Administrateur CodeS-SourceS
modif d'une petite erreur

<html>
<head>
<script type="text/javascript">

 function change(imageaaffiche){
document.getElementById('coucou').src=imageaaffiche
}
</script>
</head>
<body>
<img id ='coucou' src ='image.jpg'>
<br>
<img src ='minia.jpg onclick="change('image.jpg')" >
<img src ='minib.jpg onclick="change('image2.jpg')">
<img src ='minic.jpg onclick="change('image3.jpg')">
</body>
</html>

1 2

Cette discussion est classée dans : bouton, image, changement, souris, passant


Répondre à ce message

Sujets en rapport avec ce message

texte sur image [ par Filou07 ] Salut,J'ai mis un texte sur une image qui me sert de bouton avec un changement de couleur du bouton au passage de la souris. Ca marche mais le texte d click droit de la souris [ par ghita ] salutest ce quelqu'un peut me dire s'il existe un événement en javascript qui se declenche lors du click droit d'un objet (image par ex), j'ai une fon Gestion de la souris sur une image [ par ldm001 ] Bonjour,J'aimerais pouvoir récupérer les coordonnées de rectancles ( position, hauteur, largeur ) que l'utilisateur aurait dessinées avec la souris su preview d'une image [ par ajangot ] bonjour,je voudrais faire un bouton qui fasse apparaitre un fenetre demandans au visiteur le chemin de l'image (comme le bouton en bas du forum). Puis Détecter un clic bouton droit de la souris ? [ par zakuli ] Bonjour,Comment détecte-t-on en JavaScript un clic droit de la Souris ?mercizak Une [image] fixe qui suis la souris [ par ptitsky ] Bonjour à tous ,Mon pb :Je voudrai faire qu'une image suivent le mouvement de la souris, mais, que un bout de cette meme image reste au meme endroit.E mettre une image sous un bouton submit [ par ManuAntibes ] Voila j'ai créé une image a la place d'un bouton submit.j'ai un bouton voici le code: // du bouton Et je le remplace par l'image voici le code:<a href position de la souris sur une image [ par golgoth ] Bonjour,Comment faire pour recuperer dans un lien la position de la souris sur une image quand je clic sur celle-ci ? Est ce possible ?Merci pour votr Changement d'image d'un autre frame [ par NiFF ] Ma page est séparée en 2, et il y a deux frames : je voudrais que lorsque le visiteur clique sur une image de la frame de gauche, elle s'afiche dans u Evenement sur image lorsque Mouseover sur un lien par exemple... [ par stained ] Bonjour,je vais essayer d'etre clair...Soit un lien. Soit une image. J'aimerai qu'en passant sur le lien (Mouseover donc) il se produise un changement


Nos sponsors


Sondage...

Comparez les prix

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,733 sec (3)

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