Menú Css y Ajax

No se si os habrá pasado en alguna ocasión que intentáis poner un menú ajax pero al final lo dejáis por imposible porque suelen ser demasiado poco flexibles.

Os quiero enseñar uno que me ha gustado mucho por su sencillez a la hora de ser usado. Este menú de stunicholls lo podéis ver en su web. Lo mejor de todo es que ha sido testado para IE5.5, IE6, IE7, Firefox, Opera, Netscape, Mozilla, Safari (PC) y Safari (iPod Touch).

El código Javascript:

[jscript]
/* Credits: Stu Nicholls */
/* URL: http://www.stunicholls.com/menu/pro_dropdown_2/stuHover.js */

stuHover = function() {
var cssRule;
var newSelector;
for (var i = 0; i < document.styleSheets.length; i++)
for (var x = 0; x < document.styleSheets[i].rules.length ; x++)
{
cssRule = document.styleSheets[i].rules[x];
if (cssRule.selectorText.indexOf("LI:hover") >= 0)
{
newSelector = cssRule.selectorText.replace(/LI:hover/gi, "LI.iehover");
document.styleSheets[i].addRule(newSelector , cssRule.style.cssText);
}
}
var getElm = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<getElm.length; i++) {
getElm[i].onmouseover=function() {
this.className+=" iehover";
}
getElm[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" iehover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", stuHover);

[/jscript]

Descargar

Deja un comentario