Foros del Web » Creando para Internet » Diseño web »

problema con el submenu de la barra de navegacion

Estas en el tema de problema con el submenu de la barra de navegacion en el foro de Diseño web en Foros del Web. muy buenas. He creado para mi web una nav bar con html, css y javascript. pero debajo de la barra tengo una imagen que ocupa ...
  #1 (permalink)  
Antiguo 04/05/2010, 11:49
Avatar de paxarin  
Fecha de Ingreso: enero-2010
Ubicación: Santander
Mensajes: 413
Antigüedad: 7 años, 10 meses
Puntos: 6
problema con el submenu de la barra de navegacion

muy buenas.
He creado para mi web una nav bar con html, css y javascript.
pero debajo de la barra tengo una imagen que ocupa todo el ancho de la web.
la barra si funciona pero el submenu queda debajo de la magen y no se el por que.
Podeis ayudarme?
os dejo el codigo.
html
<script type="text/javascript" src="js/jquery-1.3.min.js"></script>
<script type="text/javascript" src="js/jslider.js"></script>
<script type="text/javascript" src="js/searchbox.js"></script>
<!--controladores del slider de imagenes-->
<script type="text/javascript">
$(function() {
$('.slider').jslider({
btnNext: ".next",
btnPrev: ".prev"

});

});
</script>
<!--controlador del nav--->
<script type="text/javascript">
function mainmenu(){
// Oculto los submenus
$(" #nav ul ").css({display: "none"});
// Defino que submenus deben estar visibles cuando se pasa el mouse por encima
$(" #nav li").hover(function(){
$(this).find('ul:first:hidden').css({visibility: "visible",display: "none"}).slideDown(400);
},function(){
$(this).find('ul:first').slideUp(400);
});
}
$(document).ready(function(){
mainmenu();
});
</script>
</head>
<body>
<div id="contenedor">
<a href="#"><img src="objetos/logotipo.jpg" width="339px" height="86px" alt="logo" class="logotipo" border="0"></a>
<div id="buscador">
<form id="buscar" method="post" action="">
<input type="text" id="s" value="¿buscas algo?" class="entrada" >
<input type="image" src="objetos/lupa.png" id="lupa" alt="buscar" title="Buscar" >
</form>
</div><!--fin de la caja de busqueda-->
<div id="menu">
<ul id="nav">
<li><a href="#">INICIO</a></li>
<li><a href="#">FORO</a></li>
<li><a href="#">LEGISLACIÓN</a>
<ul class="submenu">
<li><a href="legislacion/legislacion.html">ley general</a></li>
<li><a href="#">Ley de garantia</a></li>
<li><a href="#">Constitución española</a></li>
</ul>
</li>
<li><a href="#">NOTICIAS</a>
<ul class="submenu">
<li><a href="#">Noticias 2010</a></li>
<li><a href="#">Noticias 2009</a></li>
</ul>
</li>
<li class="contacto"><a href="#">CONTACTO</a></li>
</ul><!--final nav-->
</div>
<div id="galeria">
<div class="slider">
<ul class="imagenesslider">
<li><img src="objetos/imagen1.jpg" width="980px" height="309px" alt="imagen1" title="Pulsa para cambiar el lema sobre los botones" class="sliderimg"></li>
<li><img src="objetos/imagen2.jpg" width="980px" height="309px" alt="imagen2" title="Pulsa para cambiar el lema sobre los botones" class="sliderimg"></li>
</ul>

<img src="objetos/boton-izq.png"width="36px" height="36px" alt="boton izquierdo"title="Anterior" id="prev" class="prev">
<img src="objetos/boton-drcho.png"width="36px" height="36px" alt="boton derecho"title="siguiente" id="next" class="next">
</div><!--fin del slider-->

y el css.
/*=============navegacion========*/
* { padding:0px; margin:0px; }
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px; color:#333333;
}
#menu {
float:right;
background-image:url(objetos/nav_bg.png);
background-repeat:repeat-x;
height:30px;
width:500px;
margin-left:200px;
margin-top:3px;
padding-left:50px
}
#nav {
list-style:none;
}
#nav li {
float:left;
background-image:url(objetos/nav_li_bg.png);
background-repeat:no-repeat;
background-position: right 80%;
}
#nav li a {
display:block;
padding:7px 10px;
text-decoration:none;
color:#CCCCCC;
font-weight:bold;
}
#nav li a:hover {
color:#FFFFFF;
}
/* Submenu */
#nav ul.submenu { border:1px solid #000000; padding:5px; position:absolute; list-style:none; background-color:#333333;}
#nav ul.submenu li { float:none; background-image:url('none'); border-bottom:1px solid #999999; width:150px}
/* Subsubmenu */
#nav ul.subsubmenu { border:1px solid #000000; padding:5px; position:absolute; list-style:none; background-color:#333333; margin-left:150px; margin-top:-30px;}
#nav ul.subsubmenu li { float:none; background-image:url('none'); border-bottom:1px solid #999999; min-width:150px}
_________________
__________________
http://www.paxarindesign.es

Etiquetas: barra, navegacion, submenu
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 14:57.