Question

I have this script:

http://jsfiddle.net/NV2uV/

It works, but I do not like it.

Cons:

1. Wrench (edge blocks).
2. In the transition from one unit to another, the animation is performed in two steps (I want a continuous animation).
3. The script code is not beautiful — very much repetition.

In short – it does not look nice.

How can I improve the script to look at the animation and it was good for eyes (if you have ready-made solutions – please tell me).

---

Update:

If you set the animation smaller – that animation looks quite nice.

Update 2:

I found solution: in animate function must add setting “queue:false“, then animation will not be implemented not consistently but simultaneously.

http://jsfiddle.net/TtHBy/

But still I do not like a lot of repetitions in my script, how can it be cut and make it beautiful?

Answer 1

Do you want a horizontal Accordion menu? You could look at this jQuery example: http://designreviver.com/tutorials/jquery-examples-horizontal-accordion/

And here is another example: http://www.dynamicdrive.com/dynamicindex17/haccordion.htm

And one more: http://tympanus.net/Tutorials/ElegantAccordion/