¿script para menu lateral vertical?

**roma2722** · 25/12/2007, 15:12

hola compis, no se si es el sitio correcto, si no me lo moveis, gracias.

pues, a ver si sabeis algun script(que creo que sera algo mas vistoso jejeje) o si no como hacerlo con el html-kit. de un menu vertical con submenus, simplemente lo que quiero es poner en mi pag. algunos enlaces de interes publico agrupados por temas.o sea, que al pasar por la tematica, se abra el submenu con los enlaces.

MERCI
salu2

**wilfre505** · 06/04/2008, 19:55

Q hay man, creo q lo q buscas en un menu desplegable como el horizontal q nos enseñan a hacer en CCTW.

Yo tambien ando en las mismas pero todavia spero respuesta ya q no se si se puede editar el menu desplegable a nuestro antojo o son totalmente diferentes.

**Jugoncan** · 07/04/2008, 14:14

Pues ya que preguntais os voy a enseñar unos desplegables que encontré hace tiempo, que se pueden personalizar (ya que van con estilos), que pueden ayudar al posicionamiento, que funcionan en todos los exploradores (los del curso no van en ópera) y que a lo mejor sustituyen a los del curso (ya que cuando se los enseñé a Jorgens les gustó):
http://www.dynamicdrive.com/style/cs...menu-vertical/
http://www.dynamicdrive.com/style/cs...nu-horizontal/

A ver que os parece esos.
Saludos

**wilfre505** · 08/04/2008, 17:40

Que hay jugoncam,

estuve revisando llos links q me dist para lo d los menu desplegables pero trate d colocarlos en mi web y me salia como incompleto, cual crees que era el problema????

Otra pregunta me pondrias dar un web o explicar detalladamente para aprender a usar el 000webhost??

**Jugoncan** · 08/04/2008, 17:54

Pusistes el código css y el html en su lugar?
Te bajastes las imágenes que te indica y las metistes si cambiarle elk nombre en una carpeta llamada media junto a la css?

Para lo de 000webhost puedes ver la página de mi firma
Saludos

**wilfre505** · 08/04/2008, 18:45

Dejame decir lo q hice, cree un archivo html y otro css. (El html con el link rel hacia el css)

El codigo html lo copie en mi archivo html y el css en el archivo css, me aparecio una especie d menu pero con la ultima casilla sin la parte d abajo y no me se desplegaba nada. Q pasara?

**Jugoncan** · 08/04/2008, 18:48

Puedes subirlo para verlo y nos pasas la url?
Saludos

**wilfre505** · 08/04/2008, 18:51

voy a volver a intentar crear los archivos a ver que pasa, cualquier cosa t paso mi pag, aunq esta MUY incompleta es d avergonzarse. Jeje

**wilfre505** · 08/04/2008, 19:05

Intente volver a hacer los archivos pero qdo igual.

Aqui sta mi web http://promo32.iespana.es

Tienes que entrar dond dice Prueba de menu

**Jugoncan** · 08/04/2008, 20:35

Ah, ya me he dado cuenta que no me acordé de decirte una cosa. Lo de estilos está hecho para ponerlo en un código html, pero yo te aconsejo descomponerlo de la siguiente forma. En la hoja de estilos deja sólo esto:

Código:

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.suckerdiv ul{
margin: 0;
padding: 0;
list-style-type: none;
width: 160px; /* Width of Menu Items */
border-bottom: 1px solid #ccc;
}
	
.suckerdiv ul li{
position: relative;
}
	
/*Sub level menu items */
.suckerdiv ul li ul{
position: absolute;
width: 170px; /*sub menu width*/
top: 0;
visibility: hidden;
}

/* Sub level menu links style */
.suckerdiv ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: black;
text-decoration: none;
background: #fff;
padding: 1px 5px;
border: 1px solid #ccc;
border-bottom: 0;
}

.suckerdiv ul li a:visited{
color: black;
}

.suckerdiv ul li a:hover{
background-color: yellow;
}

.suckerdiv .subfolderstyle{
background: url(media/arrow-list.gif) no-repeat center right;
}

	
/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */

Y en la hoja html añade esto en el head:

Código:

<script type="text/javascript">

//SuckerTree Vertical Menu 1.1 (Nov 8th, 06)
//By Dynamic Drive: http://www.dynamicdrive.com/style/

var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas

function buildsubmenus(){
for (var i=0; i<menuids.length; i++){
  var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
    for (var t=0; t<ultags.length; t++){
    ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle"
		if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu
			ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item
		else //else if this is a sub level submenu (ul)
		  ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it
    ultags[t].parentNode.onmouseover=function(){
    this.getElementsByTagName("ul")[0].style.display="block"
    }
    ultags[t].parentNode.onmouseout=function(){
    this.getElementsByTagName("ul")[0].style.display="none"
    }
    }
		for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars
		ultags[t].style.visibility="visible"
		ultags[t].style.display="none"
		}
  }
}

if (window.addEventListener)
window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent)
window.attachEvent("onload", buildsubmenus)

</script>

Saludos

**wilfre505** · 08/04/2008, 21:18

Gracias al fin podre continuar con mi pag, me hacia falta ese menu.

Pero ahi podre insertar botones en esas casillas???

**Jugoncan** · 09/04/2008, 13:34

dentro de la lista puedes cambiar el texto por lo que quieras, pero procura no pasarte mucho con el alto

**wilfre505** · 09/04/2008, 18:26

He mirado la web q me dist de botones para mi web pero no entiendo muy bien como crearlos, me podrias ayudar con eso???
Stoy algo tapado con eso ultimamente, tal vez son los parciales q me tienen cansado.. xD