Accordion puzzle in quirks mode

Continuing the discussion from JQuery accordion puzzle in quirks mode:

It could be that the jQuery you are using is not suited to IE6. The following is recommended for older versions of IE.

 <script src=""></script>

As an alternative I have re-worked your example using generic Javascript that does work in all IE from IE6 onwards. It is pasted below. I have placed the onclick handlers into the html so that you can see clearly how they work. I have also added the style.display attribute to the nodes that will be toggled to allow them to be tested by the script without needing to initialise on loading.

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<style type="text/css">
body { font-family:arial, helvetica, sans-serif; font-weight:normal; font-size:14px; color:#000; text-align:left; }
#nav { width:300px; margin-left:20px; padding:10px; border:1px solid #CCC; }
h3 { font-size:16px; font-weight:bold;  }
h3.tog { cursor:pointer; color:#00F; text-decoration:underline; background-image:url('scripts-img/16-arrow-down.gif'); background-position: right top; background-repeat:no-repeat } a { color:#F00; }


<div id="nav">
  <h3>Leadership and Management</h3>
  <h3 class="tog" onclick="togg('div1',this)">Functional Academies</h3>
  <div id="div1" style="display:none">
    <ul class="menu">
      <li><a href="#">Audit</a></li>
      <li><a href="#">Communications</a></li>
      <li><a href="#">Finance</a></li>
  <!-- end div1 -->
  <h3 class="tog" onclick="togg('div2',this)">Other Divisional Academies</h3>
  <div id="div2" style="display:none">
    <ul class="menu">
      <li><a href="#">Group Operations</a></li>
      <li><a href="#">Insurance</a></li>
  <!-- end div2 -->
<!-- end nav -->
<script type="text/javascript">
 var openObj=[];  // global
 function togg(ref,clickedObj)
  { var refObj=document.getElementById(ref);
    // check if already open and close it
    if(typeof openObj[0] !="undefined" && openObj[0] !=refObj)
      { openObj[1].style.backgroundImage="url('scripts-img/16-arrow-down.gif')";
    // toggle clicked object          
    var result=("none")? ["block","16-arrow-up.png"] : ["none","16-arrow-down.gif"];[0];"url('scripts-img/"+result[1]+"')"; 
   // set refs to current open object 



Hey there.

Thanks for your effort with this. However, in the future, I recommend you look at the thread dates, since that thread was created in 2010 (5 years ago), and most certainly has moved away from this problem.

IE6 has ~ 0 users so that should have been an even bigger hint that this was an old thread :slight_smile: .


[ot] I am surprised the topic was not closed after three months?

I’m assuming that automatic rule might not apply to old threads, started on the vBulletin SPF?

1 Like

It was closed. It just doesn’t have a closed message. Which is why the OP used Reply as Linked Topic to post his reply.


Whoops, that was obvious. Sorry lol.

Sorry fellas, I should have looked at the date. Lots of changes since I was here last!

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.