Welcome to WebmasterWorld Guest from

Forum Moderators: open

Message Too Old, No Replies

Height issues with mootools accordion

accordion and dynamic height



4:57 pm on Jul 8, 2008 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member

I'm trying to do a menu with mootools (1.11) accordion. One of the accordion items has a simple 1 level tree in it; I wrote the tree class. The tree uses the mootools slider and works fine. The accordion is working fine as far as that goes, so I'm pretty sure I don't have any basic implementation problems.

When the page loads, I initialize my tree with all branches open. The tree is in the first accordion item, which is the one first displayed.

If I close and open tree branches, the accordion bounces up and down to follow the tree height, cool. But if I open another of the accordion items and then come back to the first, the accordion stops following the tree (firebug doesn't show any errors so it's not that). If one or more of the tree branches is closed when I switch and come back, the section is short and overflow is hidden, so if I then open the branch, the tree 'disappears' under the next accordion item.

I understand why that's happening - the accordion doesn't 'see' the hidden tree section when it's figuring its height to display the accordion section. I can't figure out how to fix this, though.

I did an onComplete event for the tree, wherein I switch to the next accordion section and back again to make it recalc. That works but you can see it happen and it looks dumb. I even extended the accordion class and modified its display function so that it can make the switch without transition, but it still looks dumb.

I think the answer is to get it to follow the tree height again like it does initially, but I'm now at a loss; I'm just not that good of a javascript programmer.

Does anyone have any ideas? Is the mootools 1.2 accordion any smarter? I'm not really married to using the mootools accordion, but I like mootools and can generally hack my way around it well enough to make it do its nifty things. I'm the customer so I don't really have to use it at all, but watching its animation makes me go 'hee hee' every time I see it, so I'm not real anxious to do something 'duller'.


6:19 am on Jul 9, 2008 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member

I figured it out, the accordion sets a fixed height on leaf changes, so the solution was to remove it when the expand transition finished.


2:40 pm on Jul 9, 2008 (gmt 0)

WebmasterWorld Senior Member eelixduppy is a WebmasterWorld Top Contributor of All Time 5+ Year Member

Nice, thanks for sharing :)

Featured Threads

Hot Threads This Week

Hot Threads This Month