Búsqueda en el Foro:
Buscar


« Ver tema anterior :: Ver siguiente tema »  
Autor Mensaje
Mensaje07-09-2011, 00:46 (UTC)    
Título del mensaje: Ayuda con menu Css

Hola mi problema es que tengo un menu horizontal y me gustaria agregar una especie de menu desplegable para ver otras categorias al lado de las otras opciones

Menu actual:




Como me gustaria que quede:



Este es mi codigo actual de por encima de la pagina

Código:
<style type="text/css">table[height ="102"] {margin-left:auto;margin-right:auto;}body{text-align:center; position:relative; margin:0px;}#contenedor{ margin-left:auto; margin-right:auto;}#title{display:none;}#header_container{display:none;}#nav_container{display:none;}#counter{display:none;}body{background:White; margin:0px;}#contenedor{text-align:left; width:906px; font-family:Tahoma; font-size:16px;}#headL{ width:656px; height:196px; background: url(http://img.webme.com/pic/d/descargasargentina/aresban1.png) left top no-repeat;}#headR{ width:250px; height:196px; background: url(http://img.webme.com/pic/d/descargasargentina/aresban1.png) right top no-repeat;}#menuL{ width:656px; height:36px; background: url(http://img.webme.com/pic/d/descargasargentina/906x36.jpg) left top no-repeat;}#menuR{ width:250px; background: url(http://img.webme.com/pic/d/descargasargentina/906x36.jpg) right top no-repeat;}#body{ width:906px; background: url(http://img.webme.com/pic/d/descargasargentina/fondo906.jpg) left top repeat-y;}#sidebar{ width:165px; background: url() right top repeat-y;}#sidebarL{ width:150px; background: url() left top repeat-y;}#footL{ width:656px; height:96px; background: url(http://img.webme.com/pic/d/descargasargentina/ultimo.jpg) left top no-repeat;}#footR{ width:250px; background: url(http://img.webme.com/pic/d/descargasargentina/ultimo.jpg) right top no-repeat;}#headL h1{Color:Black;}#menuOpcion a{Color:White;}#footL a{Color:White;}#headL h1{margin-left:30px;}#headL a{text-decoration:none;}#body{padding-left:25px; padding-right:10px;}#sidebar{ border-left:1px #CCC solid;}#sidebarL{ border-right:1px #CCC solid;}#footL{padding-left:25px; padding-right:10px;}#footL a { text-decoration:none;}#footL a:hover{text-decoration:underline;}#menuL{padding-left:25px; padding-right:10px;}#menuOpcion{text-align:center; color:#FFF; height:30px;}#menuOpcion a{text-decoration:none;}.menuOpcion1:hover{background:#00C; background:url(http://i1233.photobucket.com/albums/ff394/ikuriel/MenuUsers%20for%20ikode/menuBG.jpg) repeat-x left top; cursor:pointer;}.menuOpcion2:hover{background:#00C; background:url(http://i1233.photobucket.com/albums/ff394/ikuriel/MenuUsers%20for%20ikode/menuBG2.jpg) repeat-x left top; cursor:pointer;}.menuOpcion3:hover{background:#00C; background:url(http://i1233.photobucket.com/albums/ff394/ikuriel/MenuUsers%20for%20ikode/menuBG3.jpg) repeat-x left top; cursor:pointer;}.menuOpcion4:hover{background:#00C; background:url(http://i1233.photobucket.com/albums/ff394/ikuriel/MenuUsers%20for%20ikode/menuBG4.jpg) repeat-x left top; cursor:pointer;}.menuOpcion5:hover{background:#00C; background:url(http://i1233.photobucket.com/albums/ff394/ikuriel/MenuUsers%20for%20ikode/menuBG5.jpg) repeat-x left top; cursor:pointer;}</style><table id="contenedor" border="0" cellpadding="0" cellspacing="0"> <tr>   <td id="headL"><a href="/"><h1></h1></a></td>   <td id="headR"> </td>  </tr> <tr>   <td id="menuL"><table width="100%" border="0"> <tr>   <td id="menuOpcion" class="menuOpcion1" onclick="window.location='/'"><a target="_self" href="http://www.notengoares.es.tl/Biblioteca/index.htm/">Biblioteca</a></td>   <td id="menuOpcion" class="menuOpcion2" onclick="window.location='/'"><a target="_self" href="http://notengoares.es.tl/">Posts </a></td>   <td id="menuOpcion" class="menuOpcion3" onclick="window.location='/'"><a target="_self" href="http://notengoares.es.tl/Chat.htm/">Chat</a></td>   <td id="menuOpcion" class="menuOpcion4" onclick="window.location='/'"><a target="_self" href="http://notengoares.es.tl/Registro.htm">Registro</a></td>    <a target="  _self" href="  http://   /">  </a></td>  </tr></table>   </td>    <td id="menuR"></td>  </tr> <tr>   <td id="body" colspan="2"  valign="top"><table width="100%" border="0"><tr> <td>

<script>
function cambiarDisplay(id) {
if (!document.getElementById) return false;
fila = document.getElementById(id);
if (fila.style.display != "none") {
fila.style.display = "none";
} else {
fila.style.display = "";
}
}
</script>


Y este es el codigo del menu desplegable
Código:
<select name="links" onChange="top.location.href=this.form.links.options[this.form.links.selectedIndex].value">
<option selected="">Elija la secci&oacute;n que desee</option>
<option value="http://notengoares.es.tl/Musica.htm">M&uacute;sica</option>
<option value="http://notengoares.es.tl/Peliculas-y-series.htm">Peliculas y series</option>
<option value="http://notengoares.es.tl/Programas.htm">Programas</option>
<option value="http://notengoares.es.tl/Juegos-y-utilidades.htm">Juegos y utilidades</option>
</select>


alguien que me pueda decir, como ponerlo, entre donde y donde, gracias
Mostrar mensajes anteriores:   


Powered by phpBB © 2001, 2005 phpBB Group