Répondre à la discussion
Affichage des résultats 1 à 15 sur 15

changer image au survol



  1. #1
    aj95

    changer image au survol


    ------

    Bonjour,
    j'ai fait des boutons: un normal, non survolé, et l'autre d'une autre couleur, survolé.
    Je n'arrive pas à faire en sorte de changer d'image au survol et que cette image survolée renvoie à un fichier html.

    j'ai fait cela, mais je pense que c'est mieux avec des a:hover

    <img src="images2/bouton1.png" onmouseover="this.src='images2/bouton2.png';" onmouseout="this.src='images2/bouton1.png';" />

    comment faire pour que lorsqu'on survole le bouton 1 qui se change donc en bouton 2 on puisse clqiuer dessus pour aller à une autre page html?


    merci d'avance!

    -----

  2. Publicité
  3. #2
    aj95

    Re : changer image au survol

    comment faire pour que le bouton 2 soit cliquable?

  4. #3
    aj95

    Re : changer image au survol

    aidez moi s'il vous plaît!

  5. #4
    pel

    Wink Re : changer image au survol

    Salut,
    voici une solution :

    Code:
    <a href="lien_vers_ta_page.html"onmouseover="document.ton_image.src='"images/image2.png"';" onmouseout="document.ton_image.src='"images/image1.png"';"title="Lien vers la page : ..."><img src="images/image1.png" name="ton_image" alt="titre de ton image"/></a>
    .
    Essaye cette solution...

    Au plaisir.
    Dernière modification par JPL ; 04/10/2008 à 00h18.

  6. #5
    aj95

    Re : changer image au survol

    merci beaucoup quand même: l'image ne se change pas.
    je ne pense pas que ce soit trop grave mais je n'arrive pas à la faire changer..

  7. A voir en vidéo sur Futura
  8. #6
    choenix

    Re : changer image au survol

    salut

    Quelle application utilises tu déjà ?

    bye

  9. Publicité
  10. #7
    aj95

    Re : changer image au survol

    internet exploreur
    en fait il y a bien un lien sur l'image mais elle ne changepas
    et avec des a:hover?

  11. #8
    aj95

    Re : changer image au survol

    personne ne peut m'aider?
    envoyez moi le css et le html avec bouton 1 et 2 et cliquable svp
    merci

  12. #9
    eva27000

    Re : changer image au survol

    si j'ai bien compris: t'as un bouton1 qui est survolable,
    au survol il devient bouton2 cliquable.
    les 2 boutons se présentent en forme d'image - il y a pas de texte
    au click s'affiche une page.
    je vais voir se que je peux faire, mais confirme si j'ai bien compris....

  13. #10
    yoda1234

    Re : changer image au survol

    Bonjour,

    c'est ça que tu veux? http://cerig.efpg.inpg.fr/dossier/fe...yle/page12.htm
    Une simple recherche a suffit....
    Là où l'ignorance est un bienfait, c'est de la folie d'être sage (Thomas Gray).

  14. #11
    aj95

    Re : changer image au survol

    merci beaucoup, c'est parfait!!!
    j'avais recherché opendant pas mal de temps, masi certainement pas avec les bons mots...
    je fais toujours une longue recherche avant de poster!

  15. #12
    yoda1234

    Re : changer image au survol

    Les mots était "survol bouton", ce qui donne ça: http://www.google.fr/search?hl=fr&cl...chercher&meta=
    Ensuite j'ai cherché ce qui correspondait le plus à ta demande, donc le troisième lien.
    J'aurais pu aussi entrer"Rollover" ce qui m'aurait donné sans doute d'autres résultat aussi probant.
    Là où l'ignorance est un bienfait, c'est de la folie d'être sage (Thomas Gray).

  16. Publicité
  17. #13
    aj95

    Re : changer image au survol

    merci beaucoup
    je devrais améliorer mes méthodes de recherche!

  18. #14
    aj95

    Re : changer image au survol

    ca ne marche pas, e n'y arrive pas!
    voici mon code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
    <head>
    <title>Mon super site</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="mouche.css" />

    </head>


    <a href="lien_vers_ta_page.html"o nmouseover="document.ton_image .src='"images2/btn2.png"';" onmouseout="document.ton_image .src='"images2/btn1.png"';"title="Lien vers la page : ...">
    <img src="images2/btn1.png" name="ton_image" alt="titre de ton image"/> </a>



    <p>
    </p>



    <p>
    </p>
    <img src="images2/truc1.png" onmouseover="this.src='images2/truc2.png';" onmouseout="this.src='images2/truc1.png';" />
    <p>
    </p>

    le prolème c'est que ca me fait bien un lien, mais si je mais le lien pour une seule image, ca me le fait pour toutes!

    pouvez vous m'aider?

  19. #15
    aj95

    Re : changer image au survol

    c'est bon , j'ai réussi
    par contre, mes images ont un problème: elles dépassent toutes vers le bas d'au moins 50 px ce qui fait qu'elles sont très espacées.
    il faudrait que je fasse un margin bottom pour toutes ces images qui sont contenues dans le m^me dossier, mais je ne sais pas comment faire.
    pouvez vous m'aider?

    merci

Sur le même thème :

Discussions similaires

  1. Actu - Messenger réussit le premier survol de Mercure depuis 33 ans
    Par RSSBot dans le forum Commentez les actus, dossiers et définitions
    Réponses: 6
    Dernier message: 17/01/2008, 09h51
  2. Actu - En bref : survol de Japet, après les photos, le film !
    Par RSSBot dans le forum Commentez les actus, dossiers et définitions
    Réponses: 0
    Dernier message: 17/10/2007, 17h40
  3. Actu - Les premières images du survol de Japet
    Par RSSBot dans le forum Commentez les actus, dossiers et définitions
    Réponses: 17
    Dernier message: 16/09/2007, 13h36
  4. Survol du lac Saint-Pierre, Canada
    Par Hermès le Grand Héron dans le forum Environnement, développement durable et écologie
    Réponses: 0
    Dernier message: 26/09/2006, 19h53
  5. Survol réussi de Rhéa par Cassini
    Par RSSBot dans le forum Commentez les actus, dossiers et définitions
    Réponses: 0
    Dernier message: 10/12/2005, 14h42
Découvrez nos comparatifs produits sur l'informatique et les technologies.