CSS+JavaScript实现层级显示隐藏

CSS+JavaScript实现层级显示隐藏

/***************************by garcon1986********************************/

 

感谢CSDN的shan1119 帮我解决Javascript部分的错误。

<mce:script language=”JavaScript”><!– function toggle(id,id2,id3) { var state = document.getElementById(id).style.display; if (state == ‘block’) { document.getElementById(id).style.display = ‘none’; if (id2 != undefined)document.getElementById(id2).style.display = ‘none’; if (id3 != undefined)document.getElementById(id3).style.display = ‘none’; } else { document.getElementById(id).style.display = ‘block’; } } // –></mce:script> 

 

<mce:style type=”text/css”><!– #main{ position:relative; top:20px; left:20px; width:200px; background: lightblue; } #hidden { position:relative; top:0px; left:280px; width:200px; background: lightgrey; display: none; } #hidden2 { position:relative; top:-20px; left:580px; width:200px; background: lightgreen; display: none; } #hidden3 { position:relative; top:100px; left:0px; width:200px; background: lightpink; display: none; } –></mce:style><style type=”text/css” mce_bogus=”1″>#main{ position:relative; top:20px; left:20px; width:200px; background: lightblue; } #hidden { position:relative; top:0px; left:280px; width:200px; background: lightgrey; display: none; } #hidden2 { position:relative; top:-20px; left:580px; width:200px; background: lightgreen; display: none; } #hidden3 { position:relative; top:100px; left:0px; width:200px; background: lightpink; display: none; }</style> <div id=”main” onclick=”toggle(‘hidden’,’hidden2′,’hidden3′);”> 1 </div> <div id=”hidden” onclick=”toggle(‘hidden2′,’hidden3’)”> 1.1 </div> <div id=”hidden2″onclick=”toggle(‘hidden3’);”> 1.1.1 </div> <div id=”hidden3″> 1.1.1.1 </div>

 

 

原帖:http://topic.csdn.net/u/20091215/05 /0e44fd89-74b3-4622-8ce7-3b3b8927db45.html

CSS+JavaScript实现层级显示隐藏

相关文章:

你感兴趣的文章:

标签云: