Open Flex 2 Accordion Tabs on Rollover or Drag-n-Drop

I have been mostly absent for the past month because my new job in Beverly Hills has been keeping me very busy. For my current project at the new gig I needed to develop a way to spring open accordion tabs on either rollover or on the drop of an item. We decided to go with a custom solution instead and didn’t have a need for the Accordion component.

However, I wanted to post the example because I think it is very useful. To create the rollOver effects, I created a headerRenderer built from a Button and the Button’s own events. The Button headerRenderer then used its dispatch rollOver, rollOut, and click events to broadcast to the Accordion panel. The accordion tab headers are already buttons, but I wanted buttons that broadcast their events when I dragged over them or dropped items on the tab headers.

I could also have easily caused the accordion tabs to open on mouseOver without drag by using the same headerRenderer and adding events that fire those events. One more item I added was a way to broadcast a custom event that is broadcast on drop to pass the drop object data to the accordion from the headerRenderer. The example is pretty straight forward, so please take a look.

Example and Code



  1. thanks, acordion_DD..

    but, Acordion_DD source can’t download.. 🙂

    “Directory Listing Denied
    This Virtual Directory does not allow contents to be listed.”

  2. Hi Mister,

    thanks for the example, I want to write something similar.
    I can’t find where to download the source code.

  3. Hi Mister
    Thanks for sharing the example.could you please share an example using checkbox and arrow icon inside a headerrenderer

  4. Hi Mister

    Really this post is really useful..but i cant get that source,could u plzz send me how to get that source.

  5. hi, this is waht I really needed for my project. can you please let me know how can I download the source?


  6. hi

    Is it possible to show/hide the area under an accordion(VBox in example) from a rollover effect(by default it is through a click).

    when we click on the subheaders of an acordion respective area under it opens, is it possible that it happens through rollover effect. if yes then plz through some light on it.

Comments are closed.