CSS-d, I am using the jQuery Tools Flowplayer* to create a moving graphic on my page.
To give my moving graphics a nice graphical frame, I have a DIV which contains a background which is a PNG image with transparency. In the HTML, the frame DIV comes after all the code that drives the animated graphics. By setting the top margin of the frame DIV to a high negative number, its position to absolute, and its Z-index to some high number, it effectively lays over top of the animation. The result is that it looks like the animation has a nice frame around it. It looks just as I had hoped. However, I have now discovered a problem. The animation contains clickable links, and other effects that are activated by mousing over. With the frame DIV on top, however, none of them are accessible. The browser interpets the frame DIV as covering the animation, and so it blocks any mouse action trying to go through it to reach the animation. The only way I can see around this is to slice up my frame DIV into corners and sides, so as to leave the centre empty, instead of just relying on the transparency of the PNG background. This will result in some serious "DIV-itus", so before I go down this route, I was wondering if perhaps I was looking at this issue the wrong way. Perhaps there are methods for the effect I'm after that I am not aware of. So, in the end, my question is, can I lay one DIV on top of another without having the top div trapping mouse events that I want the DIV underneath to catch? I hope my question is clear. Thank you for any advice. -- Dave M G * http://flowplayer.org/tools/scrollable/index.html#autoscroll ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
