Question

Please could someone advise me regarding this. I am currently using the accordion plugin from bassistance.de working successfully when you hover over each item header to reveal each child content. I am using an unordered list for this (4 list items, each with 2 child items)

This is fine, but the requirements now call for it to:

1. automatically cycle (expand/collapse) each list item every 5 seconds, but
2. to be paused when u hover over the child content (not the parent item that usually activates the accordion functionality for that list item)
3. still retain mouseover functionality, ie. expand/collapse child contents for each list item.

I hope all of this makes sense, and if anything is unclear, please let me know and i’ll be more than happy to clarify it!

thank u!

Answer 1

To do this create a function that does two things:

1. Call click() on the next element in cycle
2. Call setTimeout with the the method itself as the first parameter, and the desired delay as the second parameter (basically function is being called recursively with a delay)

To have it stop cycling on mouseover, sorround the click() call in a if(running) and create start and stop methods to control the running variable. Bind these to mouseover on the relevant elements.

See this example for inspiration (look for the ‘And finally…’ headline).