Sent by Jesse Skinner on 9 February 2006 23:11
Hi Peter,
You can set an absolute position, width, height and z-index to a div.
You can set a top/left to position it, or you can put it beside the
'drop zone', like:
<div style="position:absolute; width:200px; height:200px; z-index:2"></div>
<div style="width:200px; height:200px;z-index:0"> drop zone </div>
These divs will have the same position and size. The 'position:absolute'
causes the element to take up no space on the page, and without left/top
the browser doesn't move it from the starting place.
You can add more layers with position:absolute, just make sure you put
them in before the 'drop zone' or whatever it is that actually takes up
space on the page.
(I was trying to solve a similar problem lately in JavaScript, dealing
with mouse events, and ended up deciding the best solution was to set a
mousemove event to the window, then calculate the mouse position to
determine whether or not it was in the destination area. Perhaps this
could help you too.)
Cheers,
Jesse Skinner
www.thefutureoftheweb.com
Peter Michaux wrote:
> Hi,
>
> Suppose I have an inline div and I want an invisible but perfectly
> matching div overlaying it. How do I do this so that when I resize the
> window or scroll the two div's remain overlayed?
>
> The reason I ask is for detecting a dragging item over a drop zone.
> The drop zone won't respond to the mouse pointer unless the drop zone
> has a higher z-index. However I want the draggable to appear above the
> drop zone. My idea is to have the drop zone on the bottom, the
> draggable in the middle and then a clear div on top of the drop zone
> at the heightest layer. That way the clear drop zone can respond to a
> mouse over.
>
> Thanks,
> Peter
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
