PDA

View Full Version : AnyLink Drop Down Menu



nate51
12-15-2007, 06:46 PM
AnyLink Drop Down Menu

http://www.dynamicdrive.com/dynamicindex1/dropmenuindex.htm

I was wondering if anyone knows how to reverse the menu direction?

I have it working great as a drop down but the second page I have it on the nav bar near the bottom and I need it to go up not down, and the page isnt small enough to force the menu up.

Any help with this would be great.

-- Nate

ddadmin
12-16-2007, 12:09 AM
The script should dynamically do this already if there isn't enough room below the anchor link to drop down fully. I reckon you wish to add the option of manually forcing the menu to drop up. If so, find the line:


function dropdownmenu(obj, e, menucontents, menuwidth){

and change that to:


function dropdownmenu(obj, e, menucontents, menuwidth, dropupBool){

Then find the line:


dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"

and change that to:


if (dropupBool==true)
dropmenuobj.style.top=dropmenuobj.y-dropmenuobj.offsetHeight+"px"
else
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"

Then, in your HTML, to force a menu to drop down, just populate the optional 5th parameter with "true":


<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1, '150px', true)" onMouseout="delayhidemenu()">Web Design</a>

nate51
12-17-2007, 03:19 AM
That worked perfect, thanks so much for the help.

-- Nate

nate51
01-04-2008, 05:11 PM
*New issue with the drop ups*

ddadmins help did work, but I now noticed in Firefox the menus that roll up (the help I got) the menus cut halfway in the button they come from.

Any help with this would be great. I can provide a link if that helps.

-- Nathan

ddadmin
01-05-2008, 01:32 AM
Sounds like a z-index issue, but yes, please post a link to the problem page.

nate51
01-05-2008, 04:02 PM
Here is a link to the issue, I had to strip the page for privacy issues. As you can see in Internet Explorer it works fine but in FireFox it doesnt.

http://ne-media.com/example/

Thank you for your help.

-- Nate

nate51
01-06-2008, 01:51 AM
I tried looking through the code and I am not sure what a "z-index" is.:confused:

nate51
01-07-2008, 12:11 AM
*bump
If anyone has any insight or advice I could use it. I have a deadline for this and am in need of help with this.

ddadmin
01-07-2008, 10:23 AM
Ok, based on the link you provided, this isn't an issue with z-Index. It seems your layout for some reason is throwing off Firefox's calculation of where those image buttons on your page are located y coordinates wise from the upper left edge of the page. The easiest way right now to fix this seems to just be to detect for Firefox, and compensate manually for this discrepancy. Find the lines:


if (dropupBool==true)
dropmenuobj.style.top=dropmenuobj.y-dropmenuobj.offsetHeight+"px"

and change that to:


if (dropupBool==true)
dropmenuobj.style.top=dropmenuobj.y-dropmenuobj.offsetHeight+(/firefox/i.test(navigator.userAgent)? -obj.offsetHeight : 0)+"px"

The part in red is new.

nate51
01-07-2008, 05:33 PM
ddadmin,

That worked great, thank you so much for the help. I hope I can repay you one day.
Hopefully someone else can benefit from this post also.

-- Nate

wizard247
06-23-2008, 02:33 AM
Thanks Nate and ddadmin - yes, this thread did help me too until I got to the last step. I'd like to use the "dropup" menu to display an image above the mouseover image, but although I have put the workaround for Firefox in the code, Firefox does not respond when I try to increase the offsetHeight in

if (dropupBool==true)
dropmenuobj.style.top=dropmenuobj.y-dropmenuobj.offsetHeight+(/firefox/i.test(navigator.userAgent)? -obj.offsetHeight : 0)+"px"

from 0 to, say -100.

It increases the gap perfectly in Explorer, but Firefox remains static.

Even with the offsetHeight set to 0, Firefox dropup box still cuts halfway into the button.

Any suggestions?

Thanks,
Wizard247

ddadmin
06-23-2008, 07:46 AM
Well, the "0" value in the line above actually affects IE only, so it makes sense changing it to say -100 only affects IE. To do the same for FF, the resulting code would look like:


if (dropupBool==true)
dropmenuobj.style.top=dropmenuobj.y-dropmenuobj.offsetHeight+(/firefox/i.test(navigator.userAgent)? -obj.offsetHeight-100 : -100)+"px"

The exact value depends on your elements' dimensions though. Please post a link to the page on your site that contains the problematic script so we can check it out.

MrJJ
05-31-2010, 08:21 PM
I'm using the same anylink drop down menu script, and I also want to make it a drop up, but the lines of code you said to find in your post, every time I search for them in the script I can't find them, and I've checked all the files used for the anylink script and can't find the lines in any of them :(, I feel like its something really simple or stupid I'm doing wrong, but I just can't for the life of me find those lines.

heres a link to the example page im trying to get to popup, (its the last one that says services)

http://weareicons.com/test/menutest.php

ddadmin
06-01-2010, 08:20 AM
Ok I've made a blog post about how to do this for version 2.x of Anylink Menu and Anylink CSS Menu here: http://www.dynamicdrive.com/forums/blog.php?b=46