Defining <DIV> on top of another <DIV> pane with transparency?

[Marcus Otmarsen]

Ok, the situation is as follows:

I defined a <DIV> like:

<div id="myid" style="position : absolute; height: 10; width: 10;"><img src="images/object.gif" height=10 width=10></div>

This pane is used to move an object around on the web page by a javascript.

As long as I define no further <div> pane everything works fine.

Then (due to other requirements) I introduced some other <div> panes similar to

<div style="position : absolute; top: 0; left: 0; width: 400px; height: 1000px;
background-image: url(image/mybackround.gif )"><img src="images/mypic.gif"></div>

From this moment on I cannot see the object defined in the first <div> statement any more.

Hmm, I guess that this is because the later <div> panes "overwrite" the first one.

Can two <div> panes on the same area co-exist?

Or can I drop one <div> pane on top of the other with transparency property?

Marcus

[Brian]

Re: Defining &lt;DIV&gt; on top of another &lt;DIV&gt; pane with transparency?

Marcus Otmarsen wrote:[color=blue]
> Ok, the situation is as follows:
>
> I defined a <DIV> like:
>
> <div id="myid" style="position : absolute; height: 10; width: 10;"><img src="images/object.gif" height=10 width=10></div>[/color]

10 what? You need a unit with css, e.g., 10px.
[color=blue]
> Can two <div> panes on the same area co-exist?[/color]

Url?

--
Brian (remove ".invalid" to email me)

http://www.tsmchughs.com/

[cruiserweight]

Re: Defining &lt;DIV&gt; on top of another &lt;DIV&gt; pane with transparency?

> I defined a <DIV> like:[color=blue]
>
> <div id="myid" style="position : absolute; height: 10; width: 10;"><img src="images/object.gif" height=10 width=10></div>
>
> Then
>
> <div style="position : absolute; top: 0; left: 0; width: 400px; height: 1000px;
> background-image: url(image/mybackround.gif )"><img src="images/mypic.gif"></div>[/color]

try giving the secondary div an id, too. otherewise it becomes
impossible to tell them apart. absolutley positioned divs can overlap,
define background-color:tranparen cy to acheived the desired affect.

[cruiserweight]

Re: Defining &lt;DIV&gt; on top of another &lt;DIV&gt; pane with transparency?

> I defined a <DIV> like:[color=blue]
>
> <div id="myid" style="position : absolute; height: 10; width: 10;"><img src="images/object.gif" height=10 width=10></div>
>
> Then
>
> <div style="position : absolute; top: 0; left: 0; width: 400px; height: 1000px;
> background-image: url(image/mybackround.gif )"><img src="images/mypic.gif"></div>[/color]

try giving the secondary div an id, too. otherewise it becomes
impossible to tell them apart. absolutley positioned divs can overlap,
define background-color:tranparen cy to acheived the desired affect.

[Mark Tranchant]

Re: Defining &lt;DIV&gt; on top of another &lt;DIV&gt; pane with transparency?

Marcus Otmarsen wrote:
[color=blue]
> Can two <div> panes on the same area co-exist?
>
> Or can I drop one <div> pane on top of the other with transparency property?[/color]

Easily. Read up on absolute positioning and z-index.

Transparency isn't widely supported (ie IE). Take a look at my site
(sig) in Firefox and find a page that needs vertical scrolling - then
watch the header bar as you scroll.

--
Mark.

http://tranchant.plus.com/

[Claire Tucker]

Re: Defining &lt;DIV&gt; on top of another &lt;DIV&gt; pane with transparency?

On Thu, 05 Aug 2004 07:53:20 +0100, Mark Tranchant
<mark@tranchant .plus.com> wrote:
[color=blue]
>Marcus Otmarsen wrote:
>[color=green]
>> Can two <div> panes on the same area co-exist?
>>
>> Or can I drop one <div> pane on top of the other with transparency property?[/color]
>
>Easily. Read up on absolute positioning and z-index.
>
>Transparency isn't widely supported (ie IE). Take a look at my site
>(sig) in Firefox and find a page that needs vertical scrolling - then
>watch the header bar as you scroll.[/color]

Is the JavaScript alert() message "Handler could not be removed" on
every newly-loaded page intentional?

-Claire

[Harag]

Re: Defining &lt;DIV&gt; on top of another &lt;DIV&gt; pane with transparency?

On Thu, 5 Aug 2004 00:56:33 +0200, ottiC@gmx.net (Marcus Otmarsen)
wrote:
[color=blue]
>Ok, the situation is as follows:
>
>I defined a <DIV> like:
>
><div id="myid" style="position : absolute; height: 10; width: 10;"><img src="images/object.gif" height=10 width=10></div>
>
>This pane is used to move an object around on the web page by a javascript.
>
>As long as I define no further <div> pane everything works fine.
>
>Then (due to other requirements) I introduced some other <div> panes similar to
>
><div style="position : absolute; top: 0; left: 0; width: 400px; height: 1000px;
> background-image: url(image/mybackround.gif )"><img src="images/mypic.gif"></div>
>
>From this moment on I cannot see the object defined in the first <div> statement any more.
>
>Hmm, I guess that this is because the later <div> panes "overwrite" the first one.
>
>Can two <div> panes on the same area co-exist?
>
>Or can I drop one <div> pane on top of the other with transparency property?
>
>Marcus[/color]


Check out the z-index property under CSS.

the higher the z-index the more priority it has over other things.

for your large div assign a value of 1 and for the div to appear ontop
of that assign a value of 2

HTH

Al