PDA

View Full Version : Horizontal Accordion with Preview Width



Rewphus
05-30-2012, 03:23 AM
1) Script Title: Horizontal Accordion script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/haccordion.htm

3) Describe problem: Can you please help me figure out how I can have the list of three widths (preview, peek, full) vs. the two widths it has now (peek, full). I would like it to load with the preview width, expand to full width on mousenter while peeking the rest of the list, and then the entire list return to preview state on mouseleave.

Thank you in advance. I find your script to be very versatile and well documented, I am just new at this still.

ddadmin
05-31-2012, 05:34 PM
Sure, try the below modified .js file. Then inside your initialization code, add a "previeww" option that specifies the "preview" width.


haccordion.setup({
accordionid: 'hc1', //main accordion div id
paneldimensions: {peekw:'50px', previeww:'100px', fullw:'400px', h:'158px'},
selectedli: [0, true], //[selectedli_index, persiststate_bool]
collapsecurrent: true //<- No comma following very last setting!
})

Rewphus
06-01-2012, 04:31 PM
That works great. Thank you.

I am sure this has been answered elsewhere, but I couldn't find it while searching the forums. What is the easiest way to add a delay to the expand animation? I know I can slow the animation effect, but I want it to actually wait a couple seconds to expand. I have tried delay() and setTimeout(), but to no avail so far.