Código:
alguno sabe a que se debe.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<link rel="stylesheet" href="menu.css" />
<script type="text/javascript" >
function BrowserDetectLite() {
var ua = navigator.userAgent.toLowerCase();
// browser name
this.isGecko = (ua.indexOf('gecko') != -1 && ua.indexOf('safari') == -1);
this.isMozilla = (this.isGecko && ua.indexOf('gecko/') + 14 == ua.length);
this.isNS = ( (this.isGecko) ? (ua.indexOf('netscape') != -1) : ( (ua.indexOf('mozilla') != -1) && (ua.indexOf('spoofer') == -1) && (ua.indexOf('compatible') == -1) && (ua.indexOf('opera') == -1) && (ua.indexOf('webtv') == -1) && (ua.indexOf('hotjava') == -1) ) );
this.isIE = ( (ua.indexOf('msie') != -1) && (ua.indexOf('opera') == -1) && (ua.indexOf('webtv') == -1) );
this.isSafari = (ua.indexOf('safari') != - 1);
this.isOpera = (ua.indexOf('opera') != -1);
this.isKonqueror = (ua.indexOf('konqueror') != -1 && !this.isSafari);
this.isIcab = (ua.indexOf('icab') != -1);
this.isAol = (ua.indexOf('aol') != -1);
// spoofing and compatible browsers
this.isIECompatible = ( (ua.indexOf('msie') != -1) && !this.isIE);
this.isNSCompatible = ( (ua.indexOf('mozilla') != -1) && !this.isNS && !this.isMozilla);
this.versionMinor = parseFloat(navigator.appVersion);
if (this.isNS && this.isGecko) {
this.versionMinor = parseFloat( ua.substring( ua.lastIndexOf('/') + 1 ) );
}
else if (this.isIE && this.versionMinor >= 4) {
this.versionMinor = parseFloat( ua.substring( ua.indexOf('msie ') + 5 ) );
}
else if (this.isMozilla) {
this.versionMinor = parseFloat( ua.substring( ua.indexOf('rv:') + 3 ) );
}
else if (this.isSafari) {
this.versionMinor = parseFloat( ua.substring( ua.lastIndexOf('/') + 1 ) );
}
else if (this.isOpera) {
if (ua.indexOf('opera/') != -1) {
this.versionMinor = parseFloat( ua.substring( ua.indexOf('opera/') + 6 ) );
}
else {
this.versionMinor = parseFloat( ua.substring( ua.indexOf('opera ') + 6 ) );
}
}
else if (this.isKonqueror) {
this.versionMinor = parseFloat( ua.substring( ua.indexOf('konqueror/') + 10 ) );
}
else if (this.isIcab) {
if (ua.indexOf('icab/') != -1) {
this.versionMinor = parseFloat( ua.substring( ua.indexOf('icab/') + 6 ) );
}
else {
this.versionMinor = parseFloat( ua.substring( ua.indexOf('icab ') + 6 ) );
}
}
this.versionMajor = parseInt(this.versionMinor);
this.geckoVersion = ( (this.isGecko) ? ua.substring( (ua.lastIndexOf('gecko/') + 6), (ua.lastIndexOf('gecko/') + 14) ) : -1 );
// dom support
this.isDOM1 = (document.getElementById);
this.isDOM2Event = (document.addEventListener && document.removeEventListener);
// css compatibility mode
this.mode = document.compatMode ? document.compatMode : 'BackCompat';
// platform
this.isWin = (ua.indexOf('win') != -1);
this.isWin32 = (this.isWin && ( ua.indexOf('95') != -1 || ua.indexOf('98') != -1 || ua.indexOf('nt') != -1 || ua.indexOf('win32') != -1 || ua.indexOf('32bit') != -1 || ua.indexOf('xp') != -1) );
this.isMac = (ua.indexOf('mac') != -1);
this.isUnix = (ua.indexOf('unix') != -1 || ua.indexOf('sunos') != -1 || ua.indexOf('bsd') != -1 || ua.indexOf('x11') != -1)
this.isLinux = (ua.indexOf('linux') != -1);
// specific browser shortcuts
this.isNS4x = (this.isNS && this.versionMajor == 4);
this.isNS40x = (this.isNS4x && this.versionMinor < 4.5);
this.isNS47x = (this.isNS4x && this.versionMinor >= 4.7);
this.isNS4up = (this.isNS && this.versionMinor >= 4);
this.isNS6x = (this.isNS && this.versionMajor == 6);
this.isNS6up = (this.isNS && this.versionMajor >= 6);
this.isNS7x = (this.isNS && this.versionMajor == 7);
this.isNS7up = (this.isNS && this.versionMajor >= 7);
this.isIE4x = (this.isIE && this.versionMajor == 4);
this.isIE4up = (this.isIE && this.versionMajor >= 4);
this.isIE5x = (this.isIE && this.versionMajor == 5);
this.isIE55 = (this.isIE && this.versionMinor == 5.5);
this.isIE5up = (this.isIE && this.versionMajor >= 5);
this.isIE6x = (this.isIE && this.versionMajor == 6);
this.isIE6up = (this.isIE && this.versionMajor >= 6);
this.isIE4xMac = (this.isIE4x && this.isMac);
}
var browser = new BrowserDetectLite();
function initMenu()
{
if ( browser.isDOM1
&& !( browser.isMac && browser.isIE )
&& !( browser.Opera && browser.versionMajor < 7 )
&& !( browser.isIE && browser.versionMajor < 5 ) )
{
// get some element
var menu = document.getElementById('menu');
var lis = menu.getElementsByTagName('li');
// change the style of the menu
menu.className="menu";
// i am searching for ul element in li element
for ( var i=0; i<lis.length; i++ )
{
// is there a ul element ?
if ( lis.item(i).getElementsByTagName('ul')[0] )
{
// improve keyboard navigation with IE
if ( browser.isIE )
{
addAnEvent(lis.item(i),'keyup',visible);
}
// apply the method to DOM compliant browsers
addAnEvent(lis.item(i),'mouseover',visible);
addAnEvent(lis.item(i),'mouseout',hidden);
addAnEvent(lis.item(i),'blur',hidden);
addAnEvent(lis.item(i),'focus',visible);
}
}
}
}
function addAnEvent( target, eventName, functionName )
{
if ( browser.isIE )
{
//target.attachEvent( 'on'+eventName, functionName ); // dont work properly with this
eval('target.on'+eventName+'=functionName');
}
else
{
target.addEventListener( eventName , functionName , true ); // true is important for Opera7
}
}
/* hide the first ul element of the current element */
function hidden()
{
/* setAttribute dont work correctly with IE */
this.getElementsByTagName('ul')[0].style.visibility = "hidden";
}
/* show the first ul element of the current element */
function visible()
{
this.getElementsByTagName('ul')[0].style.visibility = "visible";
}
/* used to improve keyboard navigation with IE */
function hiddenUl( ul )
{
if ( browser.isIE )
{
var uls = ul.getElementsByTagName('ul');
for ( var i=0; i<uls.length; i++ )
{
uls.item(i).style.visibility = "hidden";
}
ul.style.visibility = "hidden";
}
}
// not very clean but simple
// the function can be run in the HTML for faster display
window.onload=initMenu;
function hideload () {
if (document.getElementById('navi'))
{
var div_obj = document.getElementById('navi') ;
div_obj.style.display = "block" ;
}
return true;
}
</script>
<title>Generated CSS Menu</title>
<style>
body {background:#FFFFFF;font-family:verdana,serif;margin-top:8%;font-size:12px;}
#navi {display:none;}
.menu {position:absolute;top:5em;left:3em;display:block;margin:0;padding:0;width:500px;}
.menu ul{position:absolute;display:block;width:124px;margin:0;padding:0;}
.menu li ul{visibility:hidden;}
.menu li li ul{position:absolute;top:auto;left:auto;margin-left:124px;margin-top:-23px;}
.menu li{list-style:none;width:124px;height:auto;display:inline;display/**/:block;float:none;float/**/:left;margin:0;padding:0;}
* html .menu li li{display:inline;}
.menu a {text-align:center; background-color:#0099FF; );filter:Alpha(opacity=90);border:1px #000000solid;color:#000000;display:block;width:120px;text-decoration:none;padding:2px 0;margin:1px;font-weight:bold;}
.menu a:hover {background-color:#0000FF;border:1px #000000solid;}
.menu a:focus {background-color: #aaf;}
.menu span {display:none;}
div[id="navi"]>.menu a {text-align:center;background-color:#CCCCCC;);border:1px #000000solid;color:#000000;display:block;width:120px;text-decoration:none;padding:2px 0;margin:1px;}
div[id="navi"]>.menu a:hover {border:1px #000000solid;background-color:#CCCC22;}
#content p a:link, a:visited {}
#content a:hover {}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body onload="initMenu(); hideload(); ">
<div id="navi">
<ul id="menu">
<li><div id="top"><a href="index.html">Home</a></div>
<ul>
<li><a href="news.html">News</a></li>
<li><a href="articles.html">Articles</a>
<ul>
<li><a href="styling.html">CSS Sytling</a></li>
<li><a href="menus.html">CSS Menus</a>
<ul>
<li><a href="cssgen.html">CSS Menu Generator</a></li>
</ul></li>
</ul></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="about.html">About</a></li>
</ul></li>
<li><div id="top"><a href="company.html">Company</a></div>
<ul>
<li><a href="aboutcompany.html">About</a></li>
<li><a href="products.html">Products</a>
<ul>
<li><a href="software.html">Software</a>
<ul>
<li><a href="cssgen.html">CSS Menu Generator</a></li>
</ul></li>
</ul></li>
</ul></li>
<li><div id="top"><a href="opensrc.html">Open Source</a></div>
<ul>
<li><a href="patents.html">Software Patents</a></li>
<li><a href="procontra.html">Pro & Con</a>
<ul>
<li><a href="overview1.html">Open Source</a></li>
</ul></li>
<li><a href="future.html">Future</a></li>
</ul></li>
<li><div id="top"><a href="links.html">Links</a></div>
<ul>
<li><a href="http://www.wxwidgets.org">wxWidgets</a></li>
</ul></li>
</ul>
</div>
<div id="content">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras ultricies, eros et<br>
tincidunt mattis, lorem arcu porttitor quam, at accumsan mi pede et lacus.<br>
In hac habitasse platea dictumst. Class aptent taciti sociosqu ad litora torquent<br>
</div>
</body>
</html>
un saludo.
