I am trying to create a dynamic header such that:
However, due to the nature of the header overlay, (mouseenter and mouseleave JQuery events trigger the overlay to show or hide), when I hover over the parsys (inside the overlay) a mouseleave event is triggered on the container div and the header closes.
This seems to be because the parsys is contained in a separate div at the bottom of the page with id CQ and is dynamically positioned in place. This means when I mouse over the parsys, I am mousing out of the header.
Is anyone aware of a method to do this, or an example of where something similar has been done before?
Thanks in advance
I have never see something like you are describing, generally because even if you could avoid the issues with the new bar being in a differnet element it just will be a hard to author content in the hidden area (drag drop isn't going to work very well for example).
In the past when I have had similar requirements I tended to take one of several approaches depending on the preference of my authors and the specifics of the page layout.
There are I am sure others, but those cover the common variations.