Greenguy's Board - Adding a menu using php call which uses js

Greenguy's Board (http://www.greenguysboard.com/board/index.php)

- Programming & Scripting (http://www.greenguysboard.com/board/forumdisplay.php?f=15)

- - Adding a menu using php call which uses js (http://www.greenguysboard.com/board/showthread.php?t=58341)

Adding a menu using php call which uses js

I have a menu which uses js to make some sub-items hidden and show when the mouse rolls over. It works as a stand alone when I display in the browser:

Code:

http://www.lusciousdelights.com/menunavrev.php

But when I try adding to a page with this code:

Code:

the script does not seem to work:

Code:

http://www.lusciousdelights.com/linklist/amateurt.php

Is there some way I can make this work?

Thanks!

Just a guess, but maybe if you used the full URL in the menunavrev.php to the js, and css ?

Quote:

Originally Posted by Nymph (Post 486800)

Just a guess, but maybe if you used the full URL in the menunavrev.php to the js, and css ?

That's it!! Thanks |smooch|

I"m glad it worked for ya sweetie ;)

Hi,

I noticed that you are nowing using the new menus throughout the site and not just on the test page: http://www.lusciousdelights.com/linklist/amateurt.php. When I look at the pages the menu appears to go down past its bounding box and there is sometimes no space between the menu and the ad below.

I was able to hack a test fix into a downloaded copy of one of your pages that might give you some insight into the problem and lead you towards a fix. I changed

Code:

to read

Code:

and after reloading the bounding box looked better. You might try this on the test page mentioned above. While inline styles are often not regarded as good coding, if you find that the hack works I could easily provide you with some more stylistically appropriate coding.

Best of luck,
fg

Quote:

Originally Posted by flowersgone (Post 487039)

You might try this on the test page mentioned above. While inline styles are often not regarded as good coding, if you find that the hack works I could easily provide you with some more stylistically appropriate coding.

Best of luck,
fg

Thanks for your help. What I did was put a margin at the bottom of the div using a css rule for the class "menunav" which looks ok in IE, but not FF. Ugh...I might try your suggestion and see what happens.

Quote:

Originally Posted by LD (Post 487081)

I ... put a margin at the bottom of the div using a css rule for the class "menunav" which looks ok in IE, but not FF.

It now looks better on my systems on IE7, IE8, FF, and Safari but there is still a small overflow by the menu at the bottom on all of them. I think I have come up with a reasonably simple and reliable solution to the problem.

First replace:

Code:

with

Code:

and then a bit further down the page replace

Code:

with

Code:

This seemed to work nicely for me on all browsers mentioned above except IE7 which I didn't have a chance to test.

If this works for you, you can also remove the height specification from the .menunav css rule.

HTH,
fg

Thanks! haven't had a chance to play around with yet, maybe this weekend.

Actually - just noticed, for this to work you actually need to change

Code:

height: 755px;

Code:

height: auto;

in the .menunav css rule of dl_stylelusciousr.css or remove that specification completely.

Quote:

Originally Posted by LD (Post 487286)

Thanks! haven't had a chance to play around with yet, maybe this weekend.

I can see from a more careful look at your pages that LD did give it a try and am sorry to see that you had to give up. You now have

where you had

and that should probably be switched back. When the fix works properly it looks like the image here: http://development.toosxxx4.com/imag..._after_fix.jpg.

Getting it to work cross browser was trickier than I thought though. At one point I had something that seemed to work for IE8 and FF3 and then got into some trouble adjusting it for Safari. I have now tested a revised version on IE7, IE8, FF3, Safari 5 and Chrome, including FF with JavaScript disabled. I must admit that there was a bit of tweaking for nearly every browser I tested. Anyway the html and css changes are as described above with

and height: auto for ".menunav". The new JavaScript code is not that lengthy, still replaces the same bit of code, and is included below. It is a bit complicated and the browsers were picky and I will understand if LD stays with something simpler for now.

The code assumes that menunav1 has been switched back in for the div tag. If anyone has any questions please send me a pm and I thank everyone for their patience.

Code:

My apologies to LD for any time lost,
fg