JavaScript & DHTML - How to create a DHTML expandable list (works only in Internet Explorer)?
<style> .general {font-family:Verdana;font-size:11;color:white} .span_general {font-family:Verdana;font-size:9;color:white;border-style:solid;border-color:white;border-width:1px 1px 1px 1px;text-align:center;width:16;height:15;cursor:hand} </style> <script> function objectOver(x) { x.style.color="#9ff5ff"; } function objectOut(x) { x.style.color="white"; } function collapse(x) { var oTemp=eval("document.all.text_"+x); var oClick=eval("document.all.click_"+x); oTemp.style.display="none"; oClick.innerHTML="+" } else { oTemp.style.display="block"; oClick.innerHTML="-"; } } </script> </head> <body bgcolor=#224452> <div id=click_1 class=span_general onclick=javascript:collapse('1') onmouseover=javascript:objectOver(this) onmouseout=javascript:objectOut(this) style="margin-left:100;position:relative;left:-25;top:14" > - </div> <div style="margin-left:100;display:block" class=general> Text 1 TITLE bla bla </div><br> <div id=text_1 style="margin-left:100" class=general> teddfg ejwrhtwjkerhtjwekrhtwjlerht bn sadfbasdnfb asdfnbm asdfnb<br> sadfasdf wert ewrtrty rety yturtu<br> asfsdfsda rtuytyurtyu jghmkjmglkhjmkghm gfhj ghj </div> <div id=click_1_1 class=span_general onclick=javascript:collapse('1_1') onmouseover=javascript:objectOver(this) onmouseout=javascript:objectOut(this) style="margin-left:200;position:relative;left:-25;top:14" > - </div> <div style="margin-left:200;display:block" class=general> Text 1_1 TITLE bla bla </div><br> <div id=text_1_1 style="margin-left:200" class=general> teddfg ejwrhtwjkerhtjwekrhtwjlerht bn sadfbasdnfb asdfnbm asdfnb<br> sadfasdf wert ewrtrty rety yturtu<br> asfsdfsda rtuytyurtyu jghmkjmglkhjmkghm gfhj ghj </div> <div id=click_1_2 class=span_general onclick=javascript:collapse('1_2') onmouseover=javascript:objectOver(this) onmouseout=javascript:objectOut(this) style="margin-left:200;position:relative;left:-25;top:14" > - </div> <div style="margin-left:200;display:block" class=general> Text 1_2 TITLE bla bla </div><br> <div id=text_1_2 style="margin-left:200" class=general> teddfg ejwrhtwjkerhtjwekrhtwjlerht bn sadfbasdnfb asdfnbm asdfnb<br> sadfasdf wert ewrtrty rety yturtu<br> asfsdfsda rtuytyurtyu jghmkjmglkhjmkghm gfhj ghj </div> <div id=click_1_2_1 class=span_general onclick=javascript:collapse('1_2_1') onmouseover=javascript:objectOver(this) onmouseout=javascript:objectOut(this) style="margin-left:300;position:relative;left:-25;top:14" > - </div> <div style="margin-left:300;display:block" class=general> Text 1_2_1 TITLE bla bla </div><br> <div id=text_1_2_1 style="margin-left:300;display:block" class=general> teddfg ejwrhtwjkerhtjwekrhtwjlerht bn sadfbasdnfb asdfnbm asdfnb<br> sadfasdf wert ewrtrty rety yturtu<br> asfsdfsda rtuytyurtyu jghmkjmglkhjmkghm gfhj ghj </div> <div id=click_1_3 class=span_general onclick=javascript:collapse('1_3') onmouseover=javascript:objectOver(this) onmouseout=javascript:objectOut(this) style="margin-left:200;position:relative;left:-25;top:14" > - </div> <div style="margin-left:200;display:block" class=general> Text 1_3 TITLE bla bla </div><br> <div id=text_1_3 style="margin-left:200" class=general> teddfg ejwrhtwjkerhtjwekrhtwjlerht bn sadfbasdnfb asdfnbm asdfnb<br> sadfasdf wert ewrtrty rety yturtu<br> asfsdfsda rtuytyurtyu jghmkjmglkhjmkghm gfhj ghj </div>
Category: | JavaScript & DHTML |
<< Go back