HTML changer le div principal avec des liens

Salut à tous, j'aimerais savoir comment changer le corps de la page avec des liens (3 préciséments ) par exemple :

<a href="" class="lien1">PAGE1</a>
<a href="" class="lien2">PAGE2</a>
<a href="" class="lien3">PAGE3</a>

<div class="div1">CORPS1</a>
<div class="div2">CORPS2</a>
<div class="div3">CORPS3</a>

je veux que quand je clique sur un des liens, il cache le div affiché et montre le div correspondant. est-ce possible ? Merci d'avance

9 réponses

  1. <html>
    <head>
    <script language="JavaScript" type="text/JavaScript">

    function cache(rouge)
    {document.getElementById(rouge).style.visibility="hidden"}
    function montre(rouge)
    {document.getElementById(rouge).style.visibility="visible"}
    function cache(bleu)
    {document.getElementById(bleu).style.visibility="hidden"}
    function montre(bleu)
    {document.getElementById(bleu).style.visibility="visible"}
    function cache(noir)
    {document.getElementById(noir).style.visibility="hidden"}
    function montre(noir)
    {document.getElementById(noir).style.visibility="visible"}

    </script>
    </head>
    <body>
    <div id="rouge" style="position:absolute; width:670px; height:115px; z-index:3; background-color: #FF0000; border: 1px none #000000; visibility: visible;"></div>
    <div id="bleu" style="position:absolute; width:670px; height:115px; z-index:2; background-color: #0000FF; border: 1px none #000000; visibility: hidden;"></div>
    <div id="noir" style="position:absolute; width:670px; height:115px; z-index:1; background-color: #000000; border: 1px none #000000; visibility: hidden;"></div>

    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p><span onclick="cache('rouge');montre('bleu')" >montre bleu</span></p>
    <p> </p>
    <p><span onclick="cache('bleu');montre('noir')" >montre noir</span></p>
    <p> </p>
    <p><span onclick="cache('noir');montre('rouge')" >montre rouge</span></p>
    </body>
    </html>
    0
    1. Bonjour, je suis désolé, je ne peux pas vous aider, je n'ai aucune connaissance n BATCH

      J'espère que vous trouverez la solution de votre nouveau problème.

      PS: Si celui-ci est résolu n'hésitez pas à l'indiquer en cliquant sur "Marquer comme résolu"
      0
      1. Ah d'accord, en effet, j'avais mal compris ce que vous vouliez faire, toutes mes excuses !

        Bonne continuation à vous !
        0
        1. ce lien devrais être actif 1/2 j j'ai fais un exemple :: http://royaldeveloppement.url.ph/TEST/test.html
          0
          1. j'ai cherché , j'ai fais un peu de script et j'ai trouvé :)
            voila en gros le code que je voulais :

            <head>
            <script>
            function vaEtVient(){
            if(document.getElementById('invisible').style.display == 'none'){
            document.getElementById('invisible').style.display = 'block';
            document.getElementById('invisibled').style.display = 'none';
            }
            else {
            document.getElementById('invisible').style.display = 'none';
            }
            }
            </script>
            <script>
            function vaEtVientd(){
            if(document.getElementById('invisibled').style.display == 'none'){
            document.getElementById('invisibled').style.display = 'block';
            document.getElementById('invisible').style.display = 'none';
            }
            else {
            document.getElementById('invisibled').style.display = 'none';
            }
            }
            </script>
            </head>
            <body>

            <a href='javascript: vaEtVient()'>Affiches-moi</a><br>
            <a href='javascript: vaEtVientd()'>Affiches-moi2</a><br>

            <div style='display:none;' id='invisible'>
            Mon Contenu caché
            </div>

            <div style='display:none;' id='invisibled'>
            Mon Contenu caché2
            </div>

            </body>

            Sa ouvre un div avec un lien et l'autre avec un autre lien ;)
            0
            1. Non en fait les ancres vont m'amener à un endroit de la page; mais mois je veux que le lien fasse changer le div de la page en faisant disparaître les autres
              0
              1. Bonsoir,

                Je ne suis pas sûr d'avoir compris ce que vous voulez faire mais il me semble plus simple d'utiliser des ancres
                0