HTML changer le div principal avec des liens

electroking Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   -  
 Hubert -
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
A voir également:

9 réponses

Réponse 1 / 9
hharchi9 Messages postés 567 Date d'inscription   Statut Membre Dernière intervention   24
 
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
Réponse 2 / 9
electroking Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   6
 
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
Réponse 3 / 9
electroking Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   6
 
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
Réponse 4 / 9
electroking Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   6
 
ce lien devrais être actif 1/2 j j'ai fais un exemple :: http://royaldeveloppement.url.ph/TEST/test.html
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 9
hharchi9 Messages postés 567 Date d'inscription   Statut Membre Dernière intervention   24
 
Ah d'accord, en effet, j'avais mal compris ce que vous vouliez faire, toutes mes excuses !

Bonne continuation à vous !
0
Réponse 6 / 9
electroking Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   6
 
merci
0
Réponse 7 / 9
electroking Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   6
 
si vous vous y connaissez en BATCH j'ai un autre petit souci :) https://forums.commentcamarche.net/forum/affich-30793742-les-espaces-en-batch
0
Réponse 8 / 9
hharchi9 Messages postés 567 Date d'inscription   Statut Membre Dernière intervention   24
 
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
Réponse 9 / 9
Hubert
 
<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

Discussions similaires

Changer d'écran principal
darkbn37 -
Anne -

2 réponses
Raccourci clavier pour changer d'écran principal
arsene12 -
chykyza -

21 réponses
Changer d'écran principal : inverser écran 1 et 2
lukix900 -
FireMKM -

16 réponses