14/03/2011, 14:40
|
| | Fecha de Ingreso: febrero-2007
Mensajes: 232
Antigüedad: 18 años Puntos: 1 | |
Respuesta: menu con items y subitems hola gracias por responder si mira ya tengo adaptado el menu lo tengo listo utilizo listas css y un sencillo jquery para el menu te pego el codigo si deseas lo que justamente tengo problemas es como crerar las tablas en la bd he visto por hai que es una tabla para los items y otra para los subitems haora el problema que tengo es como enlazo o vinculo cuando se crea un item y que cuando se crea un subtiem i varios subitems le esepcifico que pertenece al item creado y asi sucesivamente cuando creo otro item como le digo que los sub items son para el siguiente item el problema no lo tengo en armar el menu ya lo tengo listo el problema lo tengo en como armar las tablas en la bd y hacer la relacion e ntre los itema y subitems esper ome hayas entendido te dejo le codigo de el menu
gracias.
los <ul></li>
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">About</a>
<ul>
<li><a href="#">History</a></li>
<li><a href="#">Team</a></li>
<li><a href="#">Offices</a></li>
</ul>
</li>
<li><a href="#">Services</a>
<ul>
<li><a href="#">Web Design</a></li>
<li><a href="#">Internet
Marketing</a></li>
<li><a href="#">Hosting</a></li>
<li><a href="#">Domain Names</a></li>
<li><a href="#">Broadband</a></li>
</ul>
</li>
<li><a href="#">Contact Us</a>
<ul>
<li><a href="#">United Kingdom</a></li>
<li><a href="#">France</a></li>
<li><a href="#">USA</a></li>
<li><a href="#">Australia</a></li>
</ul>
</li>
</ul>
el css
<style type="text/css">
ul {
margin: 0;
padding: 0;
list-style: none;
width: 150px;
}
ul li {
position: relative;
}
li ul {
position: absolute;
left: 149px;
top: 0;
display: none;
}
ul li a {
display: block;
text-decoration: none;
color: #777;
background: #fff;
padding: 5px;
border: 1px solid #ccc;
border-bottom: 0;
}
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; }
* html ul li a { height: 1%; }
/* End */
ul {
margin: 0;
padding: 0;
list-style: none;
width: 150px;
border-bottom: 1px solid #ccc;
}
li:hover ul { display: block; }
li:hover ul, li.over ul {
display: block;
}
</style>
el jquery :
<script type="text/javascript">
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes;
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace»
(" over", "");
}
}
}
}
}
window.onload=startList;
</script> |