Member Avatar for <M/>

I am trying to make a multi level accordion menu out of my code... I have successfully created a single level accordion but i can't add a second or third level to it.

Here is what i got:

css:

body {
    margin: 0;
    background-color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
}
#content{
    overflow:auto;
    padding:10px;
    font-size:11px;
    font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
    text-align:justify;
    color:#000;
}
#content img{
    text-align:center;
}
* {
    margin:0;
    padding:0;
    list-style:none;
}

#basic-accordian{
    border: 5px solid #EEE;
    padding: 5px;
    width: 700px;
    position: absolute;
    left: 50%;
    /* [disabled]top:50%; */
    margin-left: -175px;
    z-index: 2;
    /* [disabled]margin-top:-100px; */
}

.accordion_headings{
    padding:5px;
    background:#c30;
    color:#FFFFFF;
    border:1px solid #FFF;
    cursor:pointer;
    font-weight:bold;
}

.accordion_headings:hover{
}

.accordion_child{
    padding:15px;
    background:#EEE;
}

.header_highlight{
    background:#06f;
}

strong {
    background-color: #CCC;
    }
em {
    color: #c30;
    }

Html:

<div id="basic-accordian" ><!--Parent of the Accordion-->


<!--Start of each accordion item-->
  <div id="test-header" class="accordion_headings" >1</div><!--Heading of the accordion ( clicked to show n hide ) -->

  <!--Prefix of heading (the DIV above this) and content (the DIV below this)-->

  <div id="test-content"><!--DIV which show/hide on click of header-->

    <!--This DIV is for inline styling like padding...-->
    <div class="accordion_child">

    </div>

  </div>
<!--End of each accordion item--> 
</div>

jQuery:

<script>
eval((function(){a=" {3document5ByIdOgvv=8E!&&E!K32}o=E;E;v=parseInt(2E=o;3vdheight=vHpx}Oofvgvv=v/d.h;dDv;dfilterKalpha(D+v*100H)Obz>0z#-1:z-v90E;%eE;z<x(x-z)#+1:v+z9x%Accordians,fl=5sByTagName(diva=[]d=S;QQ,Q)=={a.push}}xL((hc=h0,hc6==hcMc+;c;coverflowKhidden;c.h=g(cc.s=(s=8)?7:s;h.f=f;h.c=a;h.match4fHH))x=h}hC=(Rj=0;j<F.c;j++n=F.c[j];n=n0,ndMn6nMn+;s=dJt4sH)Rp=0;p<s;p++s[p]=KGsJce(p,1d=s.join( break}}clearn.tQ==FPg(n,0@ed+K GP@b}}}}})(S)}x!LxC()}}",b=49;while(b>=0)a=a.replace(new RegExp("#%2345689@CDEFGHJKLMOPQRS".charAt(b),"g"),("\\\042\044.style.displayfunctionInterval(.className.length.indexOf(-)(d)if(-content).id){.style.=none{d=;z=g;x=d.h;(d,;for(i=0;i<l;i++);}else{('+n+')',9)}.substr(=blockv=Math.round(/d.sv=(v<1)?zcleard.t)}} d.offsetHeightreturn (new RegExp(.getElement+-header=undefined;ofv)gn.t=set'.onclickopacity=dthis+d.f+.spli==null=(} n=dfor(l[i]".split(""))[b--]);return a})())
</script>

The jQuery is a bit weird because the one i created was messed up in a few ways, so i just used the one from the tutorial i was viewing...

So... how do i add extra levels to this accordion?

Edited by <M/>
  • 3 Contributors
  • 5 Replies
  • 132 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by <M/>
Member Avatar for <M/>

i tried that one before, it was not very helpful :(

I do have a jquery file, i just pasted all my materials to show all my work.

Do you know how i can fix the problem based off of my code, it would be more helpful for me.

Oh, and welcome back LastMitch.

Member Avatar for LastMitch

Do you know how i can fix the problem based off of my code, it would be more helpful for me.

@micheal

Where did you get this code. Post the link to the original code so I can see what you are doing base on the original code

Oh, and welcome back LastMitch.

Not yet.

Member Avatar for <M/>

Where did you get this code. Post the link to the original code so I can see what you are doing base on the original code

I don't remember the tutorial :( but i luckily have managed to build something that builds the needs ;D
Thanks for helping out guys!

Not yet.

Oh okay... how about now?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.