Create a mouse "hover" function to change header color.

Taken From The Forum:
Forum Topic:
Last Updated: Saturday July 14 2012 - 06:07:02

Create a mouse "hover" function to change header color.

Poster: fritzwilliam
Dated: Wednesday January 18 2012 - 16:47:04 GMT

Need code snip creating the js equivalent of css expression [li a:hover] such that the DHTML (vers. 5.830) [headerbgcolor="#------"] function can include [offcolor="#------"] and [oncolor="#------"] attributes, switching colors with the mouse hovering. The menu could use more pizzaz. Also, would this be allowed under licensing?

Re: Create a mouse "hover" function to change header color.

Poster: Ruth
Dated: Thursday January 26 2012 - 8:05:51 GMT

Hi,

I did get this to work. I'm pretty sure there might be an easier way, however, I am not a js person so I had to use an existing function. Please note that below is a link to the explanation about this function so you can make changes you need. Put this in the top of your data file below the section that has menuDelay, subOffset etc.

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]);
}

mm_changeItemProperty("main menu", "Onbgcolor", 5, "#99FF99", 1);

Then in your header item that you want the onbgcolor to change put

Code:

aI("text=Onbgcolor;type=header;url=javascript:mm_changeItemProperty;");

The link to the explanation, that is, the parameters of the function. This actually has a drag drop function on it, but the explanations of the parameters will be the same no matter which 'item property' is addressed. http://support.milonic.com/demos/change ... /index.htm

Link to the menu item properties which has the numerical references to them http://www.milonic.com/itemproperties.php

In your case, you need to to go to the line below the function that begins mm_changeItemProperty( and change the "main menu" to whatever the name of your menu is where you are putting this function, then you then need to change the "Onbgcolor" to whatever the text is of the item [this is case sensitive], the 5 will be the same since that is the numerical code for onbgcolor, the color will be whatever you want, and the 1 will remain the same since that is the 'update' part which tells the item to make the change. There may be a simpler way to do this using onfunction, however, I am not knowledgeable about functions, how to use them or change them or create them. But I did try this with version 5.830 and it work.

You should upgrade, we are now at 5.909 and yours is at least 1 1/2 years old. There have been some new properties added, and functions.

Hope this helps. Post back in you need more info and I will try and help.

Ruth

Re: Create a mouse "hover" function to change header color.

Poster: fritzwilliam
Dated: Thursday January 26 2012 - 12:46:37 GMT

Thanks, Ruth. This is the most help I've ever received on a forum. Thanks again.

Re: Create a mouse "hover" function to change header color.

Poster: Ruth
Dated: Friday January 27 2012 - 2:55:19 GMT

I like helping. Thanks. So, it's better help with correct information.... I goofed. That code I posted previous

Code:

aI("text=Onbgcolor;type=header;url=javascript:mm_changeItemProperty;");

is incorrect. Rather, the only part you have to put in your aI header item is the url part. Of course you wouldn't have text=Onbgcolor and so on, that is just what we used in the demo.

So, this is what you add to your existing aI header item

Code:

url=javascript:mm_changeItemProperty;");

Hope that makes it easier

Ruth

Industrial Strength JavaScript and DHTML Menus

Create a mouse "hover" function to change header color.

Re: Create a mouse "hover" function to change header color.

Re: Create a mouse "hover" function to change header color.

Re: Create a mouse "hover" function to change header color.