Foros del Web

Foros del Web (http://www.forosdelweb.com/)
-   CSS (http://www.forosdelweb.com/f53/)
-   -   Sombra en Menú (http://www.forosdelweb.com/f53/sombra-menu-471236/)

el_tigre 08/03/2007 11:00

Sombra en Menú
 
Amigos del foro, encontré este buen menú y quisera saber como hago para meter una sombra que se muestre al pasar por sus opciones. Este es el CSS.

Código HTML:

<style type="text/css">
.menutitle{
cursor:pointer;
margin-bottom: 5px;
background-color:#ECECFF;
color:#000000;
width:140px;
padding:2px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}

.submenu{
margin-bottom: 0.5em;
}
</style>

<script type="text/javascript">

/***********************************************
* Switch Menu script- by Martial B of http://getElementById.com/
* Modified by Dynamic Drive for format & NS4/IE4 compatibility
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var persistmenu="yes" //"yes" or "no". Make sure each SPAN content contains an incrementing ID starting at 1 (id="sub1", id="sub2", etc)
var persisttype="sitewide" //enter "sitewide" for menu to persist across site, "local" for this page only

if (document.getElementById){ //DynamicDrive.com change
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}

function SwitchMenu(obj){
        if(document.getElementById){
        var el = document.getElementById(obj);
        var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
                if(el.style.display != "block"){ //DynamicDrive.com change
                        for (var i=0; i<ar.length; i++){
                                if (ar[i].className=="submenu") //DynamicDrive.com change
                                ar[i].style.display = "none";
                        }
                        el.style.display = "block";
                }else{
                        el.style.display = "none";
                }
        }
}

function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length >
0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

function onloadfunction(){
if (persistmenu=="yes"){
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=get_cookie(cookiename)
if (cookievalue!="")
document.getElementById(cookievalue).style.display="block"
}
}

function savemenustate(){
var inc=1, blockid=""
while (document.getElementById("sub"+inc)){
if (document.getElementById("sub"+inc).style.display=="block"){
blockid="sub"+inc
break
}
inc++
}
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=(persisttype=="sitewide")? blockid+";path=/" : blockid
document.cookie=cookiename+"="+cookievalue
}

if (window.addEventListener)
window.addEventListener("load", onloadfunction, false)
else if (window.attachEvent)
window.attachEvent("onload", onloadfunction)
else if (document.getElementById)
window.onload=onloadfunction

if (persistmenu=="yes" && document.getElementById)
window.onunload=savemenustate

</script>


:-)

Shiryu_Libra 08/03/2007 11:46

Re: Sombra en Menú
 
mira, no se si sea esto lo que buscas, pero si te fijas, utiliza CSS
.submenu{
margin-bottom: 0.5em;
}

si pones esto, en el sublink o submenu, cada ves que pongas el raton sobre ese submenu, lo pondra gris
.submenu a:hover{
background-color: #dddddd;
}
</style>


repito nuevamente no se si eso es lo que buscas, pero puedes ponerte a jugar con los estilos del submenu y le daras el efecto que realmente quieras, estamos?:arriba:

el_tigre 08/03/2007 13:46

Re: Sombra en Menú
 
Muchas gracias, es perfectamente lo que necesitaba.

Saludos


La zona horaria es GMT -6. Ahora son las 22:33.

Desarrollado por vBulletin® Versión 3.8.7
Derechos de Autor ©2000 - 2026, Jelsoft Enterprises Ltd.