PDA

View Full Version : Jim's DHTML Menu Conflict?



The Merg
05-18-2007, 06:06 AM
1) Script Title: Jim's DHTML Menu v5.7

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/jimmenu/index.htm

3) Describe problem: I got the script to work without any real problems, but am having a conflict with another bit of JS code. I also currently use the Lightbox2 script (http://www.huddletogether.com/projects/lightbox2/) for displaying images on my site. Basically, the Lightbox2 script opens a popup window contained in the current window in order to display the image. When I do this, the Jim's Menu stays on top of the image. Is there a way to keep the menu below the popup?

You can see this at work at http://babymergler.themerg.net/baby_merglers_website.php. Just click on the photo under the heading of "Random Photo".

Any ideas would be appreciated.

Thanks,
The Merg

--
Today's problems don't worry me,
I haven't solved yesterday's yet.

Niniel
05-18-2007, 06:15 AM
I have no idea, but I checked it out, and I noticed that your menu is too far to the right too.
Maybe you should move it down a bit so that it's below the header sticky (baby Mergler's website).

Congratulations on your baby.

The Merg
05-18-2007, 02:43 PM
Thanks for the congrats. The menu location is fixed. I had forgot to float it and it had been designed on a resolution of 1280x1024, so it shifted over when viewed at 1024x768.

Anyone have any ideas on this issue? This is one of the last two issues I have before getting the site up.

Thanks,
The Merg

--
Today's problems don't worry me,
I haven't solved yesterday's yet.

Ictinus
05-18-2007, 03:06 PM
The z-index on your menu is set at 1000 & 1001, but your lightbox is only 100.

Search for zIndex in dom-build.js
and the following in you lightbox.css file



lightbox{
position: absolute;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}

The Merg
05-18-2007, 03:17 PM
Okay, I upped the z-index on Lightbox to 2000 at that seemed to do the trick. The grayed out overlay though still appears under menu though. Basically, you get picture, menu, grayed out overlay layered in that order now.

Thanks,
Merg

Ictinus
05-18-2007, 03:51 PM
In the ligthbox.css file the #overlay has a zindex of 90. You'll need to make that larger than 1001 (the menu) or indeed lower the menu zindex values.

I'm seeing another problem looking at it with Firefox... the image is not appearing within the white border. Can't see why though.
It might be worth looking at the current demos for lightbox, the imageDataContainer appears to have a class of 'clearfix' which your pages do not. This may fix the problem with Firefox.

The Merg
05-18-2007, 05:13 PM
In the ligthbox.css file the #overlay has a zindex of 90. You'll need to make that larger than 1001 (the menu) or indeed lower the menu zindex values.

I'm seeing another problem looking at it with Firefox... the image is not appearing within the white border. Can't see why though.
It might be worth looking at the current demos for lightbox, the imageDataContainer appears to have a class of 'clearfix' which your pages do not. This may fix the problem with Firefox.

Thanks again. I used Expression Web to search the lightbox.css file for "z-index" and I got no results. I guess I shoulda just looked manually and I would've easily seen it.

As for the "clearfix" class, according to the Lighbox2 change log, he removed the "clearfix":


v2.03.1 - 4/18/07 - Fixed embed hiding. Overlay opacity var added to config. Image sets w/Imagemaps fix. Clearfix removed.

I'll post a message in the Lightbox forum about the Firefox issue (I use IE--I know, I know) since I don't use it.

- The Merg

--
Today's problems don't worry me,
I haven't solved yesterday's yet.