Set the style of your DIVs when created to display:none and they won't be "expanded". In the click code for changing the div from collapsed to expanded, you can also change the img src by specifying the img by it's ID.
Hope this helps, Rob Edwards Phone: (502) 359-1627 Systems Management Tools Pager: (502) 478-1116 United Parcel Service Fax: (502) 359-0094 EMail: [EMAIL PROTECTED] (2B || !2B) == ? -----Original Message----- From: FlashGuy [mailto:[EMAIL PROTECTED]] Sent: Thursday, August 15, 2002 1:08 PM To: CF-Talk Subject: OT: Maximizing/Minimizing menu using <span>..<div> Hi, My code is working except for a few things that I'm not sure how to correct. I've been hacking with this code for a day or two now. When you load the page the menu are "expanded". I'm not sure how to have them "minimize" upon page loading. Also, how can I load a different image (hbar-on.gif) when the menu is expanded and vice-a-versa (hbar-off.gif)? Below is my code. I removed the angle brackets around any script tags. Any help would be greatly appreciated. THanks expand.htm ------------------ <head> <title></title> <style> componentBodyText {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;font-size:65%;font-weight:regular;line-height:14px} componentHeader {color: #ffffff;font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;background-color:#ffffff;font-size:65%;font-weight:bold;text-tran sform:uppercase;} componentFooter {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;background-color:#ffffff;} componentHeaderSel {color: #ffffff;font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;background-color:#ffffff;font-size:65%;font-weight:bold;text- transform:uppercase;border-color:#cccccc} componentHeaderText {color:#ffffff;font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;font-size:65%;font-weight:bold;} </style> script type="text/javascript" function change_display(head) { var oSrcEle = window.event.srcElement sImg666 = oSrcEle.src if (document.all.item(head).style.display == "") { document.all.item(head).style.display = "none"; oSrcEle.alt = "expand menu"; } else { document.all.item(head).style.display= ""; oSrcEle.alt = "collapse menu"; } } /script script type="text/javascript" <!-- sImgDefaultArrow = ""; sImgExpandedArrow = ""; if (sImgDefaultArrow == ""){ sImgDefaultArrow = "hbar-on.gif"; } if (sImgExpandedArrow == ""){ sImgExpandedArrow = "hbar-off.gif"; } //--> /script </head> <body bgcolor="#ffffff" topmargin="0" leftmargin="0" marginheight="0" marginwidth="0"> script type="text/javascript" language="JavaScript" HTMLStr = "<DIV STYLE='background-color:white;width:100%;'>"; HTMLStr += "<DIV STYLE='position:absolute;top:0px;background-color:black;float:right;' NOWRAP></DIV>"; HTMLStr += "<DIV STYLE='position:absolute;top:0px;background-color:black;' NOWRAP></DIV>"; HTMLStr += "</DIV>"; function drawToolbar() { document.write(HTMLStr); } /script <span id="TBDownLevelDiv"></span> script language="JavaScript" type="text/javascript" <!--// Hide from old browsers var ToolBar_Supported = ToolBar_Supported; TBDownLevelDiv.style.display ='none'; drawToolbar(); var fBrowserOK = true; //--> /script <span> <table id="headeridArticle" cellpadding="0" cellspacing="0" border="0" width="220"> <tr> script language="javascript" type="text/javascript" <!-- if (fBrowserOK) { document.write("<td id=\"arrowColidArticle\" bgcolor=\"#ffffff\"><img id=\"ImgArrowidArticle\" src=" + sImgDefaultArrow + " alt=\"collapse menu\" border=\"0\" style= \"cursor:hand;\" onclick=\"change_display\(\'headingidArticle\'\)\"></td>") } //--> /script </tr> </table> <div id="headingidArticle" style="display:visible"> <a href="new.cfm"><font face="Helvetica,Arial" size="-2">[New]</font></a> <a href="rename.cfm"><font face="Helvetica,Arial" size="-2">[Rename]</font></a> <hr width="220" align="left"> </div> </span> <span> <table id="headeridArticle" cellpadding="0" cellspacing="0" border="0" width="220"> <tr> script language="javascript" type="text/javascript" <!-- if (fBrowserOK) { document.write("<td id=\"arrowColidArticle\" bgcolor=\"#ffffff\"><img id=\"ImgArrowidArticle\" src=" + sImgDefaultArrow + " alt=\"collapse menu\" border=\"0\" style= \"cursor:hand;\" onclick=\"change_display\(\'headingidArticle2\'\)\"></td>") } //--> /script </tr> </table> <div id="headingidArticle2" style="display:visible"> <a href="new.cfm"><font face="Helvetica,Arial" size="-2">[Admin]</font></a> <a href="new.cfm"><font face="Helvetica,Arial" size="-2">[Contact]</font></a> <a href="rename.cfm"><font face="Helvetica,Arial" size="-2">[Help]</font></a> <hr width="220" align="left"> </div> </span> <table cellpadding="0" cellspacing="0" border="0" width="220"> <tr> <td> <font face="Helvetica,Arial" size="-2">This email server is running an evaluation copy of the MailShield anti- spam software. Please contact your email administrator if you have any questions about this message. MailShield product info: This email server is running an evaluation copy of the MailShield anti- spam software. Please contact your email administrator if you have any questions about this message. MailShield product info: This email server is running an evaluation copy of the MailShield anti- spam software. Please contact your email administrator if you have any questions about this message. MailShield product info:</font> </td> </tr> </table> </body> ______________________________________________________________________ Structure your ColdFusion code with Fusebox. Get the official book at http://www.fusionauthority.com/bkinfo.cfm FAQ: http://www.thenetprofits.co.uk/coldfusion/faq Archives: http://www.mail-archive.com/cf-talk@houseoffusion.com/ Unsubscribe: http://www.houseoffusion.com/index.cfm?sidebar=lists
