6 replies [Last post]
JimmyPez
JimmyPez's picture
Offline
Regular
NY
Last seen: 12 years 41 weeks ago
NY
Joined: 2007-03-15
Posts: 18
Points: 0

Hey, kinda new to this....

I have a header div that contains a transparent swf animation.

This div is followed by my navLinks div, which has a negative margin to overlap the header div.

I can see the navLinks, but they are "UNDER" the swf...ie unclickable.

I tried to Z-index them both, but to no avail.

How would I set this up so the navLinks are "OVER' the swf.

(They are in the right position, just (level/z-index) wise, they are below it....Plz Hlp TY

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 3 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

I'd try adding the following

I'd try adding the following parameters to the flash bit:

Add the following to the Embed tag:
wmode="transparent"

and the next bit to the object tag:

JimmyPez
JimmyPez's picture
Offline
Regular
NY
Last seen: 12 years 41 weeks ago
NY
Joined: 2007-03-15
Posts: 18
Points: 0

sorry

I should have been more specific -

the problem is not w/ the transparency -

That works fine, I can visually SEE them w/ a transparent swf, but cannot click them.

When I change the swfs mode to opaique, i cant see them which is how i know they are underneath it.

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 6 hours 58 min ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9774
Points: 3856

If you don't set wmode to

If you don't set wmode to transparent or opaque (which MM sz works better for this), the flash will be a windowed object. That is, it is not a part of the browser, but is in its own window lying above the browser.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

JimmyPez
JimmyPez's picture
Offline
Regular
NY
Last seen: 12 years 41 weeks ago
NY
Joined: 2007-03-15
Posts: 18
Points: 0

I have set the wmode

I have set the wmode






but this still doesn't let me click the links...

you can look at the site here

http://www.roncrank.com/_crank/crank.html

also, in case you are wondering, If i move the navLinks down giving them a 30px top margin, they work fine - they just are in the wrong place---

#header{ background-image:url(../assets/headerBG.jpg); background-color:#000; margin:0; z-index:1; } .navLinks{ z-index:50; text-align:right; color:#660000; font-weight:bolder; margin:-20px 0 0 0px; padding: 0 0 10px 3em; }

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 6 hours 58 min ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9774
Points: 3856

Your negative margin sucks

Your negative margin sucks the nav up under the flash object. Z-index will reverse the topology, but it doesn't apply to non-positioned elements. Do this, and all is well:

.navLinks {
  position: relative;
  z-index:2;
  ...
  }

cheers,

gary

//edit The subject line is unintended, but funny. Smile

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

JimmyPez
JimmyPez's picture
Offline
Regular
NY
Last seen: 12 years 41 weeks ago
NY
Joined: 2007-03-15
Posts: 18
Points: 0

haha, that is funny -This

haha, that is funny -

and it worked - thanks