Afficher / Masquer une partie du message

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par tchounga04, 28 Octobre 2012.

  1. tchounga04
    tchounga04 Nouveau WRInaute
    Inscrit:
    28 Octobre 2012
    Messages:
    2
    J'aime reçus:
    0
    Bonjour,

    J'ai créé un site sur Blogger et je cherche à faire un lien "Afficher / Masquer la suite", qui afficherait ou masquerait donc une partie de l'artice en cliquant sur le lien.
    Après des jours de recherche, je ne trouve nulle par les explications ! Car j'aimerai que la suite du message s'affiche à la suite, et non pas dans une nouvelle fenêtre...

    J'aimerai faire comme ici, le lien [+/-] Clip :
    http://ziksdumonde.blogspot.fr/
    Pour pouvoir afficher ou masquer une partie du message, à la suite (et non un résumé avec un lien qui envoie vers une autre page). Un peu comme le fonctionnement des archives en fait !!

    Quelqu'un pourrait-il m'aider svp ?

    Ce serait pour mon blog :
    http://sarah-ruiz-moto-site.blogspot.fr/
    Pour ne pas que toutes les petites images chargent à chaque fois !

    D'avance, un grand merci !
     
  2. tchounga04
    tchounga04 Nouveau WRInaute
    Inscrit:
    28 Octobre 2012
    Messages:
    2
    J'aime reçus:
    0
    C'est bon j'ai trouvé =D.

    Ici pour 3 éléments :

    1. Coller le code ci-dessous, juste avant la balise </head> :


    <script>
    var hide = true;
    function showcomment()
    {

    if (hide)
    {
    document.getElementById("zonecomment").style.display='block';
    document.getElementById("suite1").innerHTML = '<b><u>Masquer</u></b>';
    hide = false;

    }
    else
    {
    document.getElementById("zonecomment").style.display='none';
    document.getElementById("suite1").innerHTML = '<b><u>Afficher la suite...</u></b>';

    hide = true;

    }
    }


    function showcomment2()
    {

    if (hide)
    {
    document.getElementById("zonecomment2").style.display='block';
    document.getElementById("suite2").innerHTML = '<b><u>Masquer</u></b>';
    hide = false;

    }
    else
    {
    document.getElementById("zonecomment2").style.display='none';
    document.getElementById("suite2").innerHTML = '<b><u>Afficher la suite...</u></b>';

    hide = true;

    }
    }


    function showcomment3()
    {

    if (hide)
    {
    document.getElementById("zonecomment3").style.display='block';
    document.getElementById("suite3").innerHTML = '<b><u>Masquer</u></b>';
    hide = false;

    }
    else
    {
    document.getElementById("zonecomment3").style.display='none';
    document.getElementById("suite3").innerHTML = '<b><u>Afficher la suite...</u></b>';

    hide = true;

    }
    }
    </script>


    2. Code html :

    - Elément 1 :

    Texte visible à l'arrivée sur la page
    <a name="comment"></a><a onclick="showcomment()" style="cursor:pointer"><div id="suite1"><b><u>Afficher la suite...</u></b></div>
    </a>
    <div id="zonecomment" style="display:none">
    Texte qui peut s'afficher et se masquer
    </div>

    - Elément 2

    Texte visible à l'arrivée sur la page
    <a name="comment"></a><a onclick="showcomment2()" style="cursor:pointer"><div id="suite2"><b><u>Afficher la suite...</u></b></div>
    </a>
    <div id="zonecomment2" style="display:none">
    Texte qui peut s'afficher et se masquer
    </div>

    - Elément 3
    Texte visible à l'arrivée sur la page
    <a name="comment"></a><a onclick="showcomment3()" style="cursor:pointer"><div id="suite3"><b><u>Afficher la suite...</u></b></div>
    </a>
    <div id="zonecomment3" style="display:none">
    Texte qui peut s'afficher et se masquer
    </div>
     
Chargement...
Similar Threads - Afficher Masquer partie Forum Date
afficher masquer on utilisant Onclick Développement d'un site Web ou d'une appli mobile 21 Janvier 2015
Afficher masquer div Développement d'un site Web ou d'une appli mobile 25 Juin 2012
[JS] Masquer / afficher un <div> à la saisie d'un <input> Développement d'un site Web ou d'une appli mobile 2 Novembre 2010
bouton + et - pour masquer et afficher un tableau (sql) Développement d'un site Web ou d'une appli mobile 26 Avril 2010
Ne pas afficher certaines conversions dans Google Ads AdWords 8 Juillet 2020
Afficher les produits suivants en ajax Développement d'un site Web ou d'une appli mobile 12 Mai 2020
Google a-t-il le droit d'afficher directement les informations des sites sans leur accord ? Droit du web (juridique, fiscalité...) 21 Février 2020
Afficher un champ dans la page profil Wordpress Développement d'un site Web ou d'une appli mobile 17 Février 2020
API pour afficher les avis Google sur son site Google : l'entreprise, les sites web, les services 10 Novembre 2019
Afficher les tags sur wordpress Développement d'un site Web ou d'une appli mobile 3 Août 2019