PDA

View Full Version : AnyLink Vertical Menu Mozilla compatability



bsr35802
04-27-2006, 05:17 PM
AnyLink Vertical Menu http://www.dynamicdrive.com/dynamicindex1/anylinkvertical.htm

Used on: Rockville HS Site - http://www.mcps.k12.md.us/schools/rockvillehs/

The compatability is "FF1+" on it and so I've put it on my site. My school runs IE and so it works perfectly. When i went home where i run mozilla firefox latest version (1.6 i believe), as soon as i put my mouse over the menu - it pushed the content bar down as the menu displayed above it. Any suggestions how to fix? Or what's wrong?
This is an urgent matter because it is part of a public school site and needs to be up to date and working asap. Thanks for your help!

bsr35802
04-28-2006, 04:33 PM
bump... please?

bsr35802
05-01-2006, 04:24 PM
Bump!!!

Dster
05-01-2006, 05:43 PM
have you tried disabling the funky fresh green mouse icon?

I noticed it worked in IE, but not in firefox.

Also, have you tried creating a blank page with nothing but the side menu, to see if it is an issue caused by other code on your page?

bsr35802
05-01-2006, 11:32 PM
have you tried disabling the funky fresh green mouse icon?

I noticed it worked in IE, but not in firefox.

Also, have you tried creating a blank page with nothing but the side menu, to see if it is an issue caused by other code on your page?

I dont see how the green mouse icon would be a problem and yes it does work in IE flawlessly.

And the menu is part of an SSL file "content.html" and if i only ran that, it has the same problem http://www.mcps.k12.md.us/schools/rockvillehs/content.html

Johnnymushio
05-02-2006, 02:00 AM
i have the same problem except with the reg anylink dropdown menu...

ie works, but not ff

japantown.awardspace.com

thast the link, mnu at the top

in ff it flies over to the left,

ie its centered to my liking

bsr35802
05-02-2006, 04:36 PM
yeah i'm at school right now so i can only check it on IE so your site is fine here... I guess we both have the problem in FF. I'm going to try to contact DD directly because i REALLY need this to work for my school.

bsr35802
05-04-2006, 03:29 AM
bump..... again

bsr35802
05-05-2006, 04:34 PM
bump............. does anyone know how to fix this????

bsr35802
05-07-2006, 06:04 AM
I wonder if anyone is smart enough to fix this problem

djr33
05-07-2006, 07:12 AM
Set the width of that to absolute and overflow:hide, I believe.

jscheuer1
05-07-2006, 07:41 AM
Set the width of that to absolute and overflow:hide, I believe.

No such thing as overflow:hide; nor is there technically width:absolute; if that is what you meant. What did you mean?

djr33
05-07-2006, 11:48 AM
Er... no. My answer was quite incomplete, and, now, looking back on it, wrong.

What I meant to say was...

set the width of it to a specific width in pixels, not a percent or blank (didn't look at the code closely, so not sure if this is done already).

And... I was thinking about overflow:hidden... or whatever it is that I've seen recently used on things that scroll and/or take up more than their allotted space. The problem, though, is that I realize this will just cut off the content, not create a line break.

So... here's a solution:
Simple answer here... shorten the links... can't be that hard to get them all to a reasonable size. (Or, just make the whole thing as wide as you need it for the widest link).


Anyway... yeah... my last answer was bad... just trying to respond, sorry.

bsr35802
05-08-2006, 03:15 AM
What I meant to say was...

set the width of it to a specific width in pixels, not a percent or blank (didn't look at the code closely, so not sure if this is done already).

So... here's a solution:
Simple answer here... shorten the links... can't be that hard to get them all to a reasonable size. (Or, just make the whole thing as wide as you need it for the widest link).


I'm sorry but i'm not sure if you fully understand the problem, or maybe i dont understand your answer, or you're not looking at the same problem. either way i'd appreciate it if you could clear things up...

the "it" you're referring to in "set the width of it" i assume refers to the table containing the orange buttons? The table is already in pixels and so are each image.

And what do you mean shorten the links? It's not like i can write less for the title of each link...

This is the file
www.mcps.k12.md.us/schools/rockvillehs/content.html

djr33
05-08-2006, 04:06 AM
Ok. If the width is already in pixels, then that's not gonna fix much. Just a thought to be sure it was set that way. Next...

Again, make the links shorter. "I can't"... deal with it. The links are too long right now and causing it to stretch. Line breaks would be confusing (though you might just be able to use <br> to make a line break in your links and problem solved.
You also could, as I said, set the width to as wide as it will ever get so you never get smaller then stretch back out.

You gotta pick here. Your content is changing... do you want your layout to change? Your links? If links, what way?


Also, really, it's a poor layout. Having the links appear above the menu makes the menu jump down and suddenly your cursor is over a link, not the menu.

The way you seem to be set on designing the page gives you errors with this script... sorry. You need to figure out what to sacrifice (moving parts, shorter links, etc) or move on to a different script.
Look for something like the tooltip or other popup script that will create a new layer above the current stuff with the links in it that you can click and navigate that way.
Actually, http://drake.marin.k12.ca.us <<my school's site... has something like that. No idea where the script is from, and, honestly, I REALLY hate it. It's horrible and hard to get your mouse from mouseingover one link to get to the embedded link without the menu disapearing, but it's a lot better suited for your needs.

The more complex, the more problems... just life. Try to figure out an alternative solution, or just deal with having to shorten your links.




OK... looking at your source code. Let's use this as an example of a link that is too long.


menu5[7]='<a href="future_doctors_scientists.shtml">Future Doctors and Scientists</a>'

This is incredibly simple. It's just html stored into an array. You can code whatever you want in there. As such, fix it!
Some suggestions:


menu5[7]='<a href="future_doctors_scientists.shtml">Fut. Dr.s and Sci.s</a>'
menu5[7]='<a href="future_doctors_scientists.shtml"><font size="-2">Future Doctors/Scientists</font></a>'
menu5[7]='<a href="future_doctors_scientists.shtml"><font size="-2">Future Doctors and Scientists</font></a>'
menu5[7]='<a href="future_doctors_scientists.shtml">Future Doctors<br>&nbsp;&nbsp;&nbsp;and Scientists</a>'

Try those, see if you like them, and fix it. It's your choice... but.. you need to redesign, not recode the script. The script is doing what it should... there's just not much you can do about it.
Other scripts might work better, but this one does this.

jscheuer1
05-08-2006, 05:06 AM
bsr35802 - Please excuse djr33, he often doesn't know what he is talking about but, for some reason feels compelled to post anyway.

I made a local copy of your page and decided I needed the css to be on page, just for testing purposes. When I did that, I saw this (highlight red):




#popitmenu a:hover{
background-color: #ff9933; color: black;
}
*/

<!-- New vertical drop down menu -->
#dropmenudiv{
position:absolute;
background-color: black;
border:1px solid #ffcc00;
border-bottom-width: 0;
font:normal 12px Verdana;
line-height:18px;
z-index:100;
visibility: hidden;
}

That is an HTML comment and a well formed one at that but, it doesn't belong in a style section or in a stylesheet. Comments for style are done like so:


/* New vertical drop down menu */

Anyways, after I removed:


<!-- New vertical drop down menu -->

The menu worked well in FF.

djr33
05-08-2006, 05:24 AM
Whoa, John, I'm just trying to help. I find it quite offensive that I try to answer the question, albeit incorrectly, then you step in say "oh, he's just an idiot" then act like I've been a nuisance. Note that it's taken you this long to try to help.
I've never claimed to know more or even as much as you do and would not have posted had the question been answered, but the 5 or so consecutive bumps in the thread made me think I should try to give my best answer.
I don't really know JS that well, but I'm learning.


As for the solution... what does that fix? How does that possibly change anything? The issue is that the content doesn't fit within the alloted space, causing it to slide the edge of the cell over. My possible solutions above would fix that (albeit in a way that's not perfect).
I'm not saying it doesn't... but i'm confused.
Anyway, thanks for answering it... and, now that it's answered, obviously there's no more need for me to try because, yes, obviously I don't know as much as you do. Sorry. I'm trying to fix that, but it's taking time.


John, I'm really not trying to be a problem... just trying to help in the ways that I can. My only fault, as I see it, is not knowing as much as you. Trying to fix that, but you will, at least for quite a while, know more than I do. Would you seriously prefer I not try and just let the thread sit here? Fine by me. (Though I think that's pretty stupid.)


bsr35802, I hope one of the above solutions works. Just trying to help. :)

jscheuer1
05-08-2006, 06:26 AM
Whoa, John, I'm just trying to help. I find it quite offensive that I try to answer the question, albeit incorrectly, then you step in say "oh, he's just an idiot" then act like I've been a nuisance. Note that it's taken you this long to try to help.

Well, I thought you might be helping but, as often happens, you were not. If you want to see how my solution works, download the OP's source and apply it. The reason it works is that having that illegal comment in the style section was preventing the script specific styles from being applied at all in FF. IE, and incidentally Opera, were more forgiving but, hey FF was only acting according to spec.

I'd appreciate it if you would stick mostly to offering solutions that you are reasonably sure will work, the way the other professors here, and almost all, regardless of 'rank', who try to help here do. When in doubt, test your work first.

Also, it is better that someone wait around with no answer until someone who knows can help them, than to have their time wasted by someone who may have even less of a clue than they do.

djr33
05-08-2006, 06:36 AM
the way the other professors here, and almost all, regardless of 'rank', who try to help here do.
You're kidding right? If you'd like, you can ask ddadmin to individually change my title back to student. As a matter of fact, that makes sense... I AM learning... and enjoying it.



Also, it is better that someone wait around with no answer until someone who knows can help them, than to have their time wasted by someone who may have even less of a clue than they do.I disagree. At least he got some help while he waited around for you to be ready to give an answer. I did my best :)

Let me just remind you of:

bump... please?
...
Bump!!!
...
bump..... again
...
bump............. does anyone know how to fix this????
...
I wonder if anyone is smart enough to fix this problemI assumed, from this, that he would like some help, any help.


So... as for the issue... I still think there is a huge problem. From what I understood of the question, he wanted to stop the menu from expanding sideways. I don't see how your test fixes a thing. The problem is in Safari as well, by the way.


EDIT: I just tried out your solution and you are absolutely correct. I didn't understand the problem... didn't realize it was supposed to pop up like that... guess I never did get a chance to test in a new version of IE.
So... glad that's fixed... but I would appreciate not being looked down upon for trying to help.
I'm gonna add a note to my signature in hopes that will make everything happy again :)

jscheuer1
05-08-2006, 08:24 AM
i have the same problem except with the reg anylink dropdown menu...

ie works, but not ff

japantown.awardspace.com

thast the link, mnu at the top

in ff it flies over to the left,

ie its centered to my liking

The main problem with that layout is its use of an image map. I'm not entirely happy with my current solution for this because it is browser specific but, it works. First replace the existing function getposOffset(what, offsettype) with this one:


function getposOffset(what, offsettype){
var mapflag=0
if (what.parentNode&&typeof what.parentNode.tagName!=='undefined'&&what.parentNode.tagName.toLowerCase()=='map'){
mapflag=1
var ocoords=what.coords.split(',')
var totaloffset=(offsettype=="left")? ocoords[0]*1 : window.opera? ocoords[3]*1-6 : ocoords[1]*1;
var parentEl=what.offsetParent;
}
else {
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
}
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
if (mapflag)
totaloffset=offsettype=="left"||document.all? totaloffset : totaloffset-110;
return totaloffset;
}

Next, move your image map into the same container as the image that uses it:


<td colspan="3"><img src="Header%20Background.gif" border="0" usemap="#Map">
<map name="Map">
<area shape="rect" coords="0,63,150,84" href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu0, '149px')" onMouseout="delayhidemenu()">
<area shape="rect" coords="151,63,300,84" href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1, '149px')" onMouseout="delayhidemenu()">
<area shape="rect" coords="301,63,450,84" href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu2, '149px')" onMouseout="delayhidemenu()">

<area shape="rect" coords="451,63,600,84" href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu3, '149px')" onMouseout="delayhidemenu()">
<area shape="rect" coords="601,63,750,84" href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu4, '149px')" onMouseout="delayhidemenu()">
<area shape="rect" coords="28,2,241,31" href="Japan Town.shtml">
</map>
</td>

A bit of a kludge and only for FF, IE and Opera (may work in others). That's it.

Note: Only works with rectangular area shapes in image maps but, that's what you have.

jscheuer1
05-08-2006, 10:37 AM
This was really bothering me, the image map thing. So I came up with this more universal way of doing it, here is the function getposOffset(what, offsettype):


function getposOffset(what, offsettype){
if (what.parentNode&&typeof what.parentNode.tagName!=='undefined'&&what.parentNode.tagName.toLowerCase()=='map'){
mapflag=1;
var ocoords=what.coords.split(',')
var totaloffset=(offsettype=="left")? ocoords[0]*1 : ocoords[3]*1;
var mapIm=what.parentNode.parentNode.getElementsByTagName('img')
for (var i_tem = 0; i_tem < mapIm.length; i_tem++)
if (mapIm[i_tem].getAttribute('usemap', 0)&&mapIm[i_tem].getAttribute('usemap', 0).replace(/^.*(#.*)/g,'$1')=='#'+what.parentNode.name)
var parentEl=mapIm[i_tem];
}
else {
mapflag=0;
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
}
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}

This requires that a global variable be added to the script here (highlight red):


/////No further editting needed

var ie4=document.all
var ns6=document.getElementById&&!document.all
var ff1=document.all
var mapflag=0


And your image map still needs to be in the same container as the image that uses it (just good practice anyway).

Finally, find this section:


if (ie4||ns6||ff1){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")-1+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+46+"px"
}

Change it to this:


if (ie4||ns6||ff1){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")-1+"px"
var oHeight=mapflag? 0 : obj.offsetHeight+46;
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+oHeight+"px"
}

Still only supports rectangular area shapes in the image map.

bsr35802
05-08-2006, 05:00 PM
Wow gentlemen callllmmm down.. no need to attack one another when everyone had good intentions.

First of all i'd like to say thank you to the both of you! I havnt tested it out in FF yet (i'm at school now) but i'll take your word for it if you tested it yourself. And djr33, thank you for your efforts/time.

second, John (if it's ok for me to call you that), I know you were merely trying to inform djr33 how to give better advice/help but the way you went about had negative connotations. But hey, i know i've given bad advice without knowing it - and luckily the person was forgiving.

third, both of you had a valid reason to post in the first place. It was nice of djr33 to post when he thought i was in a sense of hopelessness even if it wasnt practical to do so but it did confuse me.

lastly... thanks again

jscheuer1
05-08-2006, 05:41 PM
Wow gentlemen callllmmm down.. no need to attack one another when everyone had good intentions.

First of all i'd like to say thank you to the both of you! I havnt tested it out in FF yet (i'm at school now) but i'll take your word for it if you tested it yourself. And djr33, thank you for your efforts/time.

second, John (if it's ok for me to call you that), I know you were merely trying to inform djr33 how to give better advice/help but the way you went about had negative connotations. But hey, i know i've given bad advice without knowing it - and luckily the person was forgiving.

third, both of you had a valid reason to post in the first place. It was nice of djr33 to post when he thought i was in a sense of hopelessness even if it wasnt practical to do so but it did confuse me.

lastly... thanks again

You're welcome. Please don't encourage him though. I would have gotten to your problem sooner if I hadn't mistakenly thought it was being taken care of. And, as you say he confused you, not to mention me and others.

On the plus side for djr33, his intentions are good and he is helpful in the areas where he knows what he is doing. My strongest recommendation for you djr33, is to test your ideas. You will learn more that way and so will those that you intend to help.

djr33
05-08-2006, 05:57 PM
I would have gotten to your problem sooner if I hadn't mistakenly thought it was being taken care of.Because I posted?
Hmm... sorry.

Yeah... I agree... no reason to argue.

:)


Just for the record, bsr35802, I've got nothing against you. John just doesn't like that I tried to help without perfecting what I said... so.... it's him/me, not you. Glad it works for you now.




test your ideas.
In this case, there wasn't anything to test. I just suggested ways to work the layout around what was happening.
Again, never knew what the script was supposed to do because I didn't get a chance to see it work well in IE. I thought that the issue was different than what it was. Sorry 'bout that. I try to test if I can.

jscheuer1
05-08-2006, 06:30 PM
Because I posted?
Hmm... sorry.

Yeah... I agree... no reason to argue.

:)


Just for the record, bsr35802, I've got nothing against you. John just doesn't like that I tried to help without perfecting what I said... so.... it's him/me, not you. Glad it works for you now.




In this case, there wasn't anything to test. I just suggested ways to work the layout around what was happening.
Again, never knew what the script was supposed to do because I didn't get a chance to see it work well in IE. I thought that the issue was different than what it was. Sorry 'bout that. I try to test if I can.

With that attitude, tell me why, from my perspective, I shouldn't put you on my ignore list (means I will see that you've posted but not see any of the text of your posts) and treat any question that you have responded to as if it hadn't received any response?

djr33
05-08-2006, 07:58 PM
'Cause you're an elitist and can't handle someone who doesn't know as much as you do.
I'm fine with not arguing.

I'm just annoyed when someone acts like I'm a nuisance. I'm doing my best to help.

From your picture, you appear to be at least 40, so, considering, you are very immature.

I'm not trying to annoy you, but I'm also not gonna just sit back and have you insult me.


I'd be more than happy for you to tell me TO ME (not about me) that what I said was wrong... that's just fine. I will apologize for posting incorrect help, but please do not form it as a comment to someone "djr33 doesn't know anything". That's both rude and passive agressive, so, sorry if I took your bait.
I'm happy to drop it. Really. But I'm not gonna not resond when you insult me.

Can we just drop it and both try to have fun? Sounds good to me! :)


And, bsr35802, I'm really sorry for dragging your thread off topic and for, as you've pointed out, not keeping my cool. I just don't like being insulted.
I want to drop it... but not feeling like that will work.


So, seriously, what's your solution, John? I just leave the forum alone so you can be better than me without me pestering people? From MY perspective, that's what it feels like you're saying.
Please tell me what you are thinking so we can get along... no harm intended.

jscheuer1
05-08-2006, 08:21 PM
I'm a nuisance.

I didn't want to be so blunt about it but, you've said it more than once. As for feeling insulted, the truth sometimes hurts. If you cannot handle it, you don't belong here, period. Folks far more intense and critical than I am will have a go at you, most likely.

I don't want to lose sight of the fact that I see considerable potential in you. But, for my peace of mind and since you haven't given me much, if any reason to think doing otherwise will be productive at this time, I may pursue the ignore list option for a bit. I wish you no ill will. Have a nice life.

djr33
05-08-2006, 08:25 PM
What's your problem? I've said that IT FEELS LIKE YOU ARE SAYING IT.


As for feeling insulted, the truth sometimes hurts.It's not the truth. It's your screwed up way of delivering it. Tell me I'm wrong. Please. I like being right, and I can't be if I don't know I'm wrong.
Please correct me rather than insulting me, though.


Ah, and he's ignored me. Nevermind on this post then.

Hope the solution is going well, bsr35802. Good luck!