Ver Mensaje Individual
  #1 (permalink)  
Antiguo 16/02/2011, 08:28
Avatar de inkfusion
inkfusion
 
Fecha de Ingreso: febrero-2011
Mensajes: 16
Antigüedad: 13 años, 2 meses
Puntos: 2
Menu despegable

Hola a todos soy nuevo por aki y novato en web y voy haciendo mis cosillas...
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