Bonjour depuis quelques jours je suis confronter à un problème.
Je n'arrive pas à cacher plusieurs div, c'est à dire,
Quand je clique sur le div 1 cacher le div 1 mais quand je clique sur le div 2 ferme le div 2 et
non pas le div 1
Voici mon code JS pour comprendre
Code Javascript :
<!--// [CDATA[
function divaffiche(){
document.getElementById("box_keywords").style.display = "block";
document.getElementById("cache").style.display = "inline";
document.getElementById("voir").style.display = "none";
}
function divcache(){
document.getElementById("box_keywords").style.display = "none";
document.getElementById("cache").style.display = "none";
document.getElementById("voir").style.display = "inline";
}
function divclose(){
document.getElementById("box_keywords").style.display = "none";
document.getElementById("box").style.display = "none";
document.getElementById("close").style.display = "none";
document.getElementById("cache").style.display = "none";
document.getElementById("voir").style.display = "none";
}
// ]] -->
Puis dans mon html
Code HTML :
<!--Premier DIV-->
<div id="box" class="left">
<span class="_title">
<b class="box_title"><?php if (isset($box_name)) { echo $box_name; }else { echo "Sans titre";} ?></b>
<!--Close-->
<a id="close" onClick="divclose()" style="display:inline;"/>
<img align="right" src="images/button/close.gif" alt="Fermer" title="Fermer" id="close">
</a>
<!--Restore-->
<a id="voir" onClick="divaffiche()" style="display:none;"/>
<img align="right" src="images/button/restor.gif" alt="Restaurer" title="Restaurer">
</a>
<!--Minimize-->
<a id="cache" onClick="divcache()" style="display:inline;"/>
<img align="right" src="images/button/minimize.gif" alt="Minimiser" title="Minimiser">
</a>
</span>
<div id="box_keywords">
<p>5sdsd</p>
</div>
</div>
<!--Second DIV-->
<div id="box" class="right">
<span class="_title">
<b class="box_title"><?php if (isset($box_name)) { echo $box_name; }else { echo "Sans titre";} ?></b>
<!--Close-->
<a id="close" onClick="divclose()" style="display:inline;"/>
<img align="right" src="images/button/close.gif" alt="Fermer" title="Fermer" id="close">
</a>
<!--Restore-->
<a id="voir" onClick="divaffiche()" style="display:none;"/>
<img align="right" src="images/button/restor.gif" alt="Restaurer" title="Restaurer">
</a>
<!--Minimize-->
<a id="cache" onClick="divcache()" style="display:inline;"/>
<img align="right" src="images/button/minimize.gif" alt="Minimiser" title="Minimiser">
</a>
</span>
<div id="box_keywords">
<p>5sdsd</p>
</div>
</div>
Ce code s'affiche sous la forme de deux boite cote à cote
+--------------------+ +-------------------+
|Titre 2 _ X| |Titre 1 _ X|
| | | |
| | | |
+--------------------+ +-------------------+
Le X représente FERMER le _ Réduire car le X fait completement disparaitre le div alors que le _ cache le contenue et le remplace pare une autre image restaurer voire l'image restaure de la fenêtre windows.
Merci à toust ceux qui vont répondre au message