Back To Start Of Archive
Taken From The Forum: Help & Support for DHTML Menu Version 5+
Forum Topic: Click to view post
Last Updated: Saturday July 14 2012 - 06:07:44
a code no longer works
Poster: Ruth
Dated: Sunday February 8 2004 - 5:28:28 GMT
I have on my site now rc31 and was fixing things getting ready to put the latest and discovered that a code that works with this doesn't work after this version. Hergio was kind enough to help me so I could do text mouseovers on three items and not have to use images. This goes in the head of the page
Code:
<SCRIPT>
function changeText(id,toThis)
{id.innerHTML = toThis;}
</SCRIPT>
Then in the menu are these two items coding like this function changeText(id,toThis)
{id.innerHTML = toThis;}
</SCRIPT>
Code:
aI("text=<span onMouseOut=\"changeText(this,'MENU')\" onMouseOver=\"changeText(this,'^TOP')\">MENU</span>;url=#top;");
aI("text=<span onMouseOut=\"changeText(this,'Remembrance of 9-11')\" onMouseOver=\"changeText(this,'Heroes in our Hearts')\"> Remembrance of 9-11</span>;url=http://www.poems2u.com/911/index.html;itemwidth=133;");
aI("text=a bunch of text here<span onMouseOut=\"changeText(this,'I love this menu! <BR>HIGHLY RECOMMENDED!!')\" onMouseOver=\"changeText(this,'Wonderfully Versatile!<BR> CHECK THEM OUT! ')\"><font color=#ddbbff>I love</font> <font color=33CCFF> this MENU!<BR></font> <font color=FFCCCC>CHECK THEM OUT!! </font> </span></center><br>;url=http://www.milonic.co.uk/;target=_blank");
aI("text=<span onMouseOut=\"changeText(this,'Remembrance of 9-11')\" onMouseOver=\"changeText(this,'Heroes in our Hearts')\"> Remembrance of 9-11</span>;url=http://www.poems2u.com/911/index.html;itemwidth=133;");
aI("text=a bunch of text here<span onMouseOut=\"changeText(this,'I love this menu! <BR>HIGHLY RECOMMENDED!!')\" onMouseOver=\"changeText(this,'Wonderfully Versatile!<BR> CHECK THEM OUT! ')\"><font color=#ddbbff>I love</font> <font color=33CCFF> this MENU!<BR></font> <font color=FFCCCC>CHECK THEM OUT!! </font> </span></center><br>;url=http://www.milonic.co.uk/;target=_blank");
LINK REMOVED
Ruth
Poster: kevin3442
Dated: Monday February 9 2004 - 18:40:07 GMT
Hi Ruth,
I posted a function a while back called mm_changeItemProperty() that can be used to change menu item properties programatically. Since the text of an item is one of it's properties, you could use this function to get the "text change on mouseover" effect that you're looking for. The function call and its parameters are described in detail in this reply. I'll use your "MENU / ^TOP" example to illustrate how you'd use the function.
Code:
aI("text=MENU;url=#top;onfunction=mm_changeItemProperty('main1','MENU',1,'^TOP',1);offfunction=mm_changeItemProperty('main1','^TOP',1,'MENU',1)";);
This part of the menu item
Code:
onfunction=mm_changeItemProperty('main1','MENU',1,'^TOP',1);
does this: When you mouse over the "MENU" item in the "main1" menu, it'll cause a call to mm_changeItemProperties(). The first parameter tells the function to look in the menu named "menu1" for a menu item with the text "MENU" and change that item's text (codeRef 1 is the text= property) to "^TOP"... the 1 in the 4th parameter to the function cause the onscreen change to be applied immediately. Now, of course, the offfunction version has to look for the renamed text, "^TOP", and change it back to "MENU".
It's a little more complicated than Dave's function, but it works in the latest release (I just tested it) and it also has the virtue of being able to change any other menu item property, for any menu item, in any menu! Holler if you want to use it and need more help getting it to work.
Kevin
Poster: Ruth
Dated: Tuesday February 10 2004 - 0:04:01 GMT
Actually, I understand your explanation at the link you gave, it's not long-winded it's pretty thorough. I mean I understand what the function is doing, and you explain the 5 parameters, but I don't know how I'm supposed to change it, or do I need it there twice for the different menus that want to use that function.
Quote:
function mm_changeItemProperty(menuName, itemName, codeRef, newValue, updateDisplay)
{
menuName = menuName.toLowerCase();
for (i=0; i<_mi.length; i++)
if (_mi[i][1].replace(/\ \;/ig,' ') == itemName && _m[_mi[i][0]][1] == menuName) break;
if (i == _mi.length) return;
_mi[i][codeRef] = newValue;
if (updateDisplay) BDMenu(_mi[i][0]);
}
the name of the menu (its menuName) is given in the first line...
the itemName you pass in the function call...
codeRef...
newValue...
updateDisplay
{
menuName = menuName.toLowerCase();
for (i=0; i<_mi.length; i++)
if (_mi[i][1].replace(/\ \;/ig,' ') == itemName && _m[_mi[i][0]][1] == menuName) break;
if (i == _mi.length) return;
_mi[i][codeRef] = newValue;
if (updateDisplay) BDMenu(_mi[i][0]);
}
the name of the menu (its menuName) is given in the first line...
the itemName you pass in the function call...
codeRef...
newValue...
updateDisplay
so in the instance you gave me for the MENU change to ^TOP / menuName would be main1 / itemName would be MENU / codeRef would be 1 / newValue would be ^TOP / updateDisplay [I'm not sure.... 1?] I think those are the things needed, but I don't know where to put them. I did try to plug them in ... like main1, I tried in the two places in the first line where you see menuName and so on. But, it never worked. I guess you can tell, I have no idea about 'writing' javascript things.
[Also, I'm not sure if this means anything, but when I pasted that function at the top of my menu_data file it immediately changed the color of things below [I've got an editor that colors different items, like numbers are red, code is fuschia etc.] All of a sudden, in the first style definition with(main1=new mm_style()){
onclass="main1On"; normally displayed in black [text] , the "main1On" turned blue. The function you did for me with the new date didn't cause anything to change like that.] This function seems to be great in that you can use it to do so many changes, though for now, I'll just be thankful if I can get my text to change on mouseover. I do appreciate you help, Kevin. Thanks. [I kind of run on, too!]
Ruth
Poster: Ruth
Dated: Wednesday February 11 2004 - 6:39:52 GMT
Ok, I read the directions of the example closer and think I figured it out,
but I just keep getting an error message when I try it.
missing formal parameter Line: 22, Column: 31 Source Code:
function mm_changeItemProperty('main1', 'MENU', 1, '^TOP', 1).
this is what I have...and I have absolutely no idea if it's anywhere near
correct.
Code:
function mm_changeItemProperty('main1', 'MENU', 1, '^TOP', 1)
{
menuName = menuName.toLowerCase();
for (i=0; i<_mi.length; i++)
if (_mi[i][1].replace(/\ \;/ig,' ') == itemName && _m[_mi[i][0]][1] == menuName) break;
if (i == _mi.length) return;
_mi[i][codeRef] = newValue;
if (updateDisplay) BDMenu(_mi[i][0]);
}
{
menuName = menuName.toLowerCase();
for (i=0; i<_mi.length; i++)
if (_mi[i][1].replace(/\ \;/ig,' ') == itemName && _m[_mi[i][0]][1] == menuName) break;
if (i == _mi.length) return;
_mi[i][codeRef] = newValue;
if (updateDisplay) BDMenu(_mi[i][0]);
}
Thank you.
Ruth
Poster: kevin3442
Dated: Thursday February 12 2004 - 5:33:03 GMT
Hi Ruth,
You're confusing the function definition with the function call and sort of mixing them together. The function is defined (in this case, at the top of your .js file) like so:
Code:
function mm_changeItemProperty(menuName, itemName, codeRef, newValue, updateDisplay)
{
menuName = menuName.toLowerCase();
for (i=0; i<_mi.length; i++)
if (_mi[i][1].replace(/\ \;/ig,' ') == itemName && _m[_mi[i][0]][1] == menuName) break;
if (i == _mi.length) return;
_mi[i][codeRef] = newValue;
if (updateDisplay) BDMenu(_mi[i][0]);
}
{
menuName = menuName.toLowerCase();
for (i=0; i<_mi.length; i++)
if (_mi[i][1].replace(/\ \;/ig,' ') == itemName && _m[_mi[i][0]][1] == menuName) break;
if (i == _mi.length) return;
_mi[i][codeRef] = newValue;
if (updateDisplay) BDMenu(_mi[i][0]);
}
Thenames of the five parameters are menuName, itemName, codeRef, newValue, and updateDisplay. They need to stay that way throughout the entire function definition.
When you call the function (i.e., when you want to actually use it), you "pass" values into these parameters for the function to use. A function call might look like this:
Code:
mm_changeItemProperty('mainmenu','Products',55,120,1);
Now, the function would look for a menu item named "Products" in the menu named "mainmenu" and change its itemwidth (codeRef 55) to a new value of 120; the last parameter, a 1, forces the change to take effect immediately.
Your function calls, from the onfunction/offfunction properties of a menu item, would be as illustrated in my previous post. You pass the name of the menu, the text in the menu item you want to change, a codeRef of 1 because thats the code for the text poperty, the new text you want to use, and a 1 to force the change. The tricky par for you is that the onfunction use passes the original text followed by the new text. But the offfunction must now look for the new text since it has changed) and pass the new text followed by the original text. Your MENU/^TOP item would look like this:
Code:
aI("text=MENU;url=#top;onfunction=mm_changeItemProperty('main1','MENU',1,'^TOP',1);offfunction=mm_changeItemProperty('main1','^TOP',1,'MENU',1);");
(note that the last time I posted this example, I got the next-to-last semicolon in the wrong place, which probably would have completely prevented the menus from appearing... sorry ).
I had a look at your menu code (using the 12-2003.js file from the first example you posted a URL to). I've modified that file and posted it here. The approach works well for he two simple menu items. However, that last one -- the one with the praise for Milonic Menus -- might be a bit trickier since it has so much text and html code in the text= property (I can see why Dave took the approach he did). For now, I just made the last bit (the part that changes with a mouseover) a separate item in that menu. Probably not what you're looking for though. If not, give a holler and we'll see what else we can whip up.
Kevin
Poster: Ruth
Dated: Thursday February 12 2004 - 9:51:30 GMT
They need two new smilies...one dancing and one pulling out hair Tonight I would be ::dancing:: it works perfectly. And, now I know why the person I asked in a computer chat if they knew where I would put the menu name....they looked at the function....and they kept saying, why would you put anything in it, and I kept saying 'cause the directions say put the menu name in the first line but I don't know which place to use in the first line"
Thank you so much Kevin. You can really do things to the menu with that...especially use text instead of images and still make it look dynamic...even use different fonts and colors if you're using on/off class also. And, I really like the way the milonic one turned out, it looks real sharp, eye catching.
And, just as a bit of info...when the final came out all of a sudden I had what looked like two borders [personally I like it, but I couldn't figure out what was doing it] well, tonight I found out when you use the on/offclas like I did and put in a padding parameter that's what gives you that extra box.
I got booted I do like the table, but in all your 'spare' time, if you ever do get it figured to be able to do that html font color and stuff, I wouldn't mind having it. Only if you're messing because you want to do it, because I'm leaving the table as is. The final finished site will be up probably Friday. I'll post so you can check it out.
Ruth
Ruth