• Masquer/afficher

    Par rimoussitta dans Astuces le 9 Avril 2013 à 21:17

    Par Rimoussitta :)

    Voici un code assez sympa qui permet en cliquant sur le bouton d'afficher un autre texte ou une image !

    Voici le code :

    <div style="text-align: center;">
    <div class="c1" onclick="pchild=this.getElementsByTagName('p'); if(pchild[0].style.visibility!='hidden'){pchild[0].style.visibility='hidden'; pchild[0].style.height='0';}else{pchild[0].style.visibility=''; pchild[0].style.height=''}"><span style="color: #000000; font-weight: bold;"><span style="font-family: georgia;"> <input class="voteJoueur ui-button ui-widget ui-state-default ui-corner-all" type="submit" value="Clique ici" /></span></span><br style="color: #ffffff;" />
    <p style="text-align: center; font-family: georgia;"><span style="font-family: arial,helvetica,sans-serif;"><strong><span style="color: #333333;">Surprise !</span></strong></span></p>

     

    • Les champs en jaune sont essentiellement ceux qui doivent être modifiés, la phrase "Clique ici" sera sur le bouton et la phrase "Surprise!" sera celle qui apparaitra quand on clique sur le bouton. 
    • On peut faire a même chose avec une image ou avec plusieurs codes divers, par exemple le code de l'image :

     

    <div style="text-align: center;">
    <div class="c1" onclick="pchild=this.getElementsByTagName('p'); if(pchild[0].style.visibility!='hidden'){pchild[0].style.visibility='hidden'; pchild[0].style.height='0';}else{pchild[0].style.visibility=''; pchild[0].style.height=''}"><span style="color: #000000; font-weight: bold;"><span style="font-family: georgia;"> <input class="voteJoueur ui-button ui-widget ui-state-default ui-corner-all" type="submit" value="Clique ici" /></span></span><br style="color: #ffffff;" />
    <p style="text-align: center; font-family: georgia;"><span style="font-family: arial,helvetica,sans-serif;"><strong><span style="color: #333333;"><img src="L'adresse de l'image" alt="" /></span></strong></span></p>

  • Commentaires

    1
    marjoriecatez
    Mardi 14 Mai 2013 à 21:58

    trop cool ^^ trés bien expliquer même les codes pas super connue , j'aimerai clui qui rode en se moment sur lapin un curseur avec un mot écrit que personnes ne veut donner le code ...

    Répondre
    2
    rimoussitta Profil de rimoussitta
    Mercredi 15 Mai 2013 à 20:52
    rimoussitta

    D'accord je vais le chercher ! ^^

    Répondre
    3
    marjoriecatez
    Dimanche 19 Mai 2013 à 19:47

    ce serai cool ^^

    Répondre
    4
    marjoriecatez
    Lundi 20 Mai 2013 à 11:53

    tu l'a ?!

    Répondre
    5
    Matti0
    Samedi 5 Avril 2014 à 12:54

    Je ne voudrais pas faire de la pub négative, mais ce code est dans le blog de LiseFleur...ouch

    Répondre
    6
    licorne^^
    Vendredi 16 Décembre 2016 à 20:30

    je vais essayerhttp://smileygratos.free.fr/smiley/big_yellow/smiley%20content%20petit.png

    Répondre
    Suivre le flux RSS des commentaires


    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :