Un saludo a todos, tngo una dudilla, que es que hace poco me baje un ejemplo de un menu despegable como este: ya lo he tocado algo yo:
<html>
<head>
<title>inkfusion</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
#capa_contenedora{
position:absolute;
width:150px;
top:50px;
/*height:50px;*/
background:#000000;
z-index:4;
}
#ill{
color:#FFFFFF;
margin-left:15px;
font-family:Arial, Helvetica, sans-serif;
}
</style>
<script language="javascript">
var SalirMenu=0,Nuevo=0;
function aparecer(){
Nuevo=parseFloat(document.getElementById("capa_con tenedora").style.left)+2;
document.getElementById("capa_contenedora").style. left=Nuevo+"px";
if(Nuevo<0 && SalirMenu==1){
setTimeout("aparecer()",1);
}
}
function desaparecer(){
Nuevo=parseFloat(document.getElementById("capa_con tenedora").style.left)-2;
document.getElementById("capa_contenedora").style. left=Nuevo+"px";
if(Nuevo>-130 && SalirMenu==0){
setTimeout("desaparecer()",1);
}
}
</script>
</head>
<body>
<div id="capa_contenedora" style="left:-130" onMouseOver="SalirMenu=1;aparecer();" onMouseOut="SalirMenu=0;desaparecer();">
<div id="ill">
ILLUSTRATION
</div>
</div>
</body>
</html>
y va de perlas, pro ahora lo quiero meter a una pagina que esty montando, pro, se se me descoloca todo, y no funciona nada el menu:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Inkfusion</title>
<script language="javascript">
var SalirMenu=0,Nuevo=0;
function aparecer(){
Nuevo=parseFloat(document.getElementById("capa_con tenedora").style.left)+2;
document.getElementById("capa_contenedora").style. left=Nuevo+"px";
if(Nuevo<0 && SalirMenu==1){
setTimeout("aparecer()",1);
}
}
function desaparecer(){
Nuevo=parseFloat(document.getElementById("capa_con tenedora").style.left)-2;
document.getElementById("capa_contenedora").style. left=Nuevo+"px";
if(Nuevo>-130 && SalirMenu==0){
setTimeout("desaparecer()",1);
}
}
</script>
<style type="text/css">
body{
background-color:#CCCCCC;
margin:0px;
}
#contenedor{
background-color:#FFFFFF;
width:1100px;
margin:auto;
}
#cabecera{
background-color:#000000;
}
#logo{
margin-left:10px;
padding:20px 0;
float:left;
}
#as{
float:right;
margin-right:10px;
padding-top:20px;
}
.nofloat{
clear:both;
}
#menu{
background-color:#FF0000;
width:190px;
height:180px;
margin:0px;
font-size:20px;
font-family:Verdana, Arial, Helvetica, sans-serif;
list-style:none;
}
.navegador{
background-color:#FFFFFF;
}
#capa_contenedora{
position:absolute;
width:150px;
top:50px;
/*height:50px;*/
background:#000000;
z-index:4;
}
#ill{
color:#FFFFFF;
margin-left:15px;
font-family:Arial, Helvetica, sans-serif;
}
</style>
</head>
<body>
<div id="capa_contenedora" style="left:-130" onMouseOver="SalirMenu=1;aparecer();" onMouseOut="SalirMenu=0;desaparecer();">
<div id="ill">
ILLUSTRATION
</div>
</div>
<div id="contenedor">
<div id="cabecera">
<div id="logo">
<img src="images/logo.png" width="228" height="38">
</div>
<div id="as">
<img src="images/as.png" width="45" height="38">
</div>
<div class="nofloat"></div>
</div>
<div id="menu">
<div class="navegador">
<ul id="menu">
<li>WALL PAINTS</li>
<li>ILLUSTRATION</li>
<li>GRAPHIC DESIGN</li>
<li>PHOTOGRAPHY</li>
</ul>
</div>
</div>
<div id="cuerpo">
</div>
</div>
<div id="pie">
</div>
</div>
</body>
</html>
No se que pasa, pro creo que deberia funcionar, pro no, a ver si podeis ayudarme pork m sty volviendo loco
gracias a todos de antemano!!
www.inkfusion.es
