Hi.
I have just downloaded a WordPress theme which has a pre-installed horizontal accordion on the homepage.
The .css is:
.haccordion{
padding: 0;
}
.haccordion ul{
margin: 0;
padding: 0;
list-style: none;
overflow: hidden; /*leave as is*/
}
.haccordion li{
margin: 0;
padding: 0;
display: block; /*leave as is*/
width: 100%; /*For users with JS disabled: Width of each content*/
height: 200px; /*For users with JS disabled: Height of each content*/
overflow: hidden; /*leave as is*/
float: left; /*leave as is*/
}
.haccordion li .hpanel{
width: 100%; /*For users with JS disabled: Width of each content*/
height: 200px; /*For users with JS disabled: Height of each content*/
}
<script type="text/javascript">
haccordion.setup({
accordionid: 'hc1', //main accordion div id
paneldimensions: {peekw:'50px', fullw:'786px', h:'786px'},
selectedli: [0, true], //[selectedli_index, persiststate_bool]
collapsecurrent: false //<- No comma following very last setting!
})
haccordion.setup({
accordionid: 'hc2', //main accordion div id
paneldimensions: {peekw:'30px', fullw:'786px', h:'786px'},
selectedli: [-1, true], //[selectedli_index, persiststate_bool]
collapsecurrent: false //<- No comma following very last setting!
})
</script>
...which all seems pretty straightforward...
The .js is:
<script type="text/javascript">
haccordion.setup({
accordionid: 'hc1', //main accordion div id
paneldimensions: {peekw:'50px', fullw:'786px', h:'430px'},
selectedli: [0, true], //[selectedli_index, persiststate_bool]
collapsecurrent: false //collapse current expanded li when mouseout into general space?
})
</script>
...again, fairly straightforward...
The problem is that, when I go to the homepage, the first panel of the accordion is open with the other accordion 'tabs' visible on the right - all good so far - but the second I roll over, the accordion collapses and won't re-open...the hyperlinks still work off the 'tabs', but each layer / panel of the accordion refuses to open, roleed over, clicked on, whatever...
Any suggestions?