Liens sans charger de pages

julien_ · 9 Mai 2008

Voilà, je m'explique, j'ai mis des images disposée à droite et un bloc (pour l'instant vide) à gauche...
J'aimerai que lorsqu'on clic sur une des images j'ai à gauche par exemple le texte qui explique l'image...
Je pourrai tout bonnement le faire en dupliquant des pages mais je trouve ça assez barbant et moins pro et ça fait quelques temps que je suis intéressé par ce genre de technique...

Si la compréhension n'est pas facile je fairai un exemple

Merci d'avance

Ps: J'ai trouvé seulement j'ai plusieurs parties et j'aimerai qu'elles soit indépendantes l'une de l'autre
Donc que le dernier texte au dessus ne s'éfface pas lorsque je clic dans la 2nd partie...

<html>
<head>
<script type="text/javascript">
function show_div(id)
{
for (var i = 1; i <= 8; i++)
{
if (i == id)
{
document.getElementById('div_' + i).style.display = 'block';
}
else
{
document.getElementById('div_' + i).style.display = 'none';
}
}
}
</script>
</head>

<body>

<h1>Part1</h1>
<div id="div_1" style="display: none">harkor v1</div>
<div id="div_2" style="display: none">harkor v2</div>
<div id="div_3" style="display: none">vegabel</div>
<div id="div_4" style="display: none">divalinéa</div>

<p>
<a onclick="show_div(1)"img src="harkorv1_.jpg" alt="harkor" //abr />
<a onclick="show_div(2)"img src="harkorv2_.jpg" alt="harkor" //abr />
<a onclick="show_div(3)"img src="vegabel_.jpg" alt="harkor" //abr />
<a onclick="show_div(4)"img src="divalinea_.jpg" alt="harkor" //a>
</p>

<h1>Part2</h2>
<div id="div_5" style="display: none">harkor v1</div>
<div id="div_6" style="display: none">harkor v2</div>
<div id="div_7" style="display: none">vegabel</div>
<div id="div_8" style="display: none">divalinéa</div>

<p>
<a onclick="show_div(5)">lien5</abr />
<a onclick="show_div(6)">lien6</abr />
<a onclick="show_div(6)">lien7</abr />
<a onclick="show_div(">lien8</a>
</p>

</body>
</html>

julien_ · 9 Mai 2008

Ok j'ai compris, j'avais oublié de faire une modif pour le fonctionnement

<html>
<head>
<script type="text/javascript">
function show_div(id)
{
for (var i = 1; i <= 4; i++)
{
if (i == id)
{
document.getElementById('div_' + i).style.display = 'block';
}
else
{
document.getElementById('div_' + i).style.display = 'none';
}
}
}
</script>

<script type="text/javascript">
function show_div2(id)
{
for (var i = 1; i <= 4; i++)
{
if (i == id)
{
document.getElementById('div2_' + i).style.display = 'block';
}
else
{
document.getElementById('div2_' + i).style.display = 'none';
}
}
}
</script>

</head>

<body>

<h1>Part1</h1>
<div id="div_1" style="display: none">harkor v1</div>
<div id="div_2" style="display: none">harkor v2</div>
<div id="div_3" style="display: none">vegabel</div>
<div id="div_4" style="display: none">divalinéa</div>

<p>
<a onclick="show_div(1)"img src="harkorv1_.jpg" alt="harkor" //abr />
<a onclick="show_div(2)"img src="harkorv2_.jpg" alt="harkor" //abr />
<a onclick="show_div(3)"img src="vegabel_.jpg" alt="harkor" //abr />
<a onclick="show_div(4)"img src="divalinea_.jpg" alt="harkor" //a>
</p>

<h1>Part2</h2>
<div id="div2_1" style="display: none">harkor v1</div>
<div id="div2_2" style="display: none">harkor v2</div>
<div id="div2_3" style="display: none">vegabel</div>
<div id="div2_4" style="display: none">divalinéa</div>

<p>
<a onclick="show_div2(1)">lien5</abr />
<a onclick="show_div2(2)">lien6</abr />
<a onclick="show_div2(3)">lien7</abr />
<a onclick="show_div2(4)">lien8</a>
</p>

</body>
</html>

Liens sans charger de pages

julien_

harkor.be

julien_

harkor.be

Autres sujets récents