PDA

View Full Version : AnyLink hides behind ads



kyley
02-21-2007, 03:13 PM
1) Script Title:
AnyLink CSS Vertical Menu
2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex1/anylinkcss2.htm
3) Describe problem:
On our development site (http://dev.lessonplanspage.com), this menu is hiding behind Flash-based ads as seen in this image:
http://dev.lessonplanspage.com/menu_overlap.gif
It works great otherwise - is there any way to force it to overlap these Flash ads? Some Flash ads go behind the menu, others are in front of it. Currently, Ford Fusion and Microsoft LiveSearch are a couple that cover up the menu. "Lesson Plans" at the top and "HotChalk" / "Resource Sites" etc. on the left menu expand. Can we prevent this from happening somehow? Thanks,
--Kyle

jscheuer1
02-21-2007, 03:38 PM
Since you have no control over the these flash ads, their code, there is very little that you can do. You could try rewriting or or adding to their code onload but, I am uncertain as to how successful this would be. The usual solution (when you have control over the flash content's code) is to:


Add the following parameter to the OBJECT tag:

<param name="wmode" value="transparent">

Add the following attribute to the EMBED tag:

wmode="transparent"

jscheuer1
02-21-2007, 03:51 PM
I looked at your page further and it appears that at least some of the 'offending' flash ads have the proper wmode set. It then becomes a problem of z-index stacking. Try this in your stylesheet (replace the existing .dropDown definitions):


.dropDown{
position:absolute;
visibility: hidden;
border:1px solid 000000;
border-bottom-width: 0;
font:normal 10px arial;
line-height: 18px;
z-index: 10000000;
background-color: #2586d7;
width: 205px;
}

kyley
02-21-2007, 03:53 PM
Thanks for the quick reply John. So there's nothing the CSS can do to force itself to be on top?

If not, are you aware of any other type of expandable menu that could be created to overlap these ads? Either one that is created already, or a way we could write one that would work in a similar way? Thanks,
--Kyle

jscheuer1
02-21-2007, 03:57 PM
We just cross posted, see:

http://www.dynamicdrive.com/forums/showpost.php?p=76308&postcount=3

kyley
02-21-2007, 03:59 PM
Yep - missed that. I just tried it, and so far it's working!! :) Can't say for sure that it will work with all ads, but so far so good... Thanks a bunch,
--Kyle

kyley
02-21-2007, 04:13 PM
Ugh, I found a couple that broke it...
http://dev.lessonplanspage.com/menu_overlap2.gif
So perhaps a Flash based menu would be a better option? Thanks,
--Kyle

kwanza3
02-23-2007, 05:24 AM
I'm also working on this issue. The other "problem" i found is I can't change the font size to make it smaller in the css. Everything else I can change, color padding, line-height, but I can't change the size of the font.

jscheuer1
02-23-2007, 06:34 AM
If you are using the version of Anylink in this thread (there are several versions available in the DD library), you go into the anylinkvertical.css file and change it there (red):


.anylinkcss{
position:absolute;
visibility: hidden;
border:1px solid gray;
border-bottom-width: 0;
font:normal 8px Verdana;
line-height: 18px;
z-index: 100;
background-color: white;
width: 205px;
}

.anylinkcss a{
color: black;
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid gray;
padding: 1px 0;
text-decoration: none;
font-weight: bold;
text-indent: 5px;
}

.anylinkcss a:hover{ /*hover background color*/
background-color: #F8FBBD;
color: black;
}

It was 12, 8 is pretty small.