Privacidad: Recuerde que la información escrita en los foros de programación es 100% pública y que su ip será registrada asociada a su mensaje. Si encuentra un mensaje fuera de lugar, por favor, notifiquelo para su revisión y eliminación.
Menus desplegables
Enviado por lr el día 24 de marzo de 2004
Hola a todos, ¿alguien podría decirme (preferiblemente con un código de ejemplo sencillo) cómo se hace un menu desplegable con desbordamiento?, por ejemplo como el que sale al pasar el raton sobre \'About Acer\' en http://global.acer.com/ Un saludo y muchas gracias a todos.
/*
Configure menu styles below
NOTE: To edit the link colors, go to the STYLE tags and edit the ssm2Items colors
*/
hdrFontFamily="Verdana";
hdrFontSize="2";
hdrFontColor="white";
hdrBGColor="#666666";
linkFontFamily="Verdana";
linkFontSize="1";
linkBGColor="white";
linkOverBGColor="#CCCCCC";
linkTarget="_top";
YOffset=20;
staticYOffset=20;
menuBGColor="black";
menuIsStatic="yes";
menuHeader="Gamarod.com.ar"
menuWidth=150; // Must be a multiple of 5!
staticMode="advanced"
barBGColor="#333333";
barFontFamily="Verdana";
barFontSize="2";
barFontColor="white";
barText="Gamarod JavaScript";
function moveOut() {
if (window.cancel) {cancel="";}
if (window.moving2) {clearTimeout(moving2); moving2="";}
if ((IE && ssm2.style.pixelLeft<0)||(NS && document.ssm2.left<0)) {
if (IE) {ssm2.style.pixelLeft += (5%menuWidth);}
if (NS) {document.ssm2.left += (5%menuWidth);}
moving1 = setTimeout('moveOut()', 5)}
else {clearTimeout(moving1)}};
function moveBack() {
cancel = moveBack1()}
function moveBack1() {
if (window.moving1) {clearTimeout(moving1)}
if ((IE && ssm2.style.pixelLeft>(-menuWidth))||(NS && document.ssm2.left>(-140))) {
if (IE) {ssm2.style.pixelLeft -= (5%menuWidth);}
if (NS) {document.ssm2.left -= (5%menuWidth);}
moving2 = setTimeout('moveBack1()', 5)}
else {clearTimeout(moving2)}};
lastY = 0;
function makeStatic(mode) {
if (IE) {winY = document.body.scrollTop;var NM=ssm2.style}
if (NS) {winY = window.pageYOffset;var NM=document.ssm2}
if (mode=="smooth") {
if ((IE||NS) && winY!=lastY) {
smooth = .2 * (winY - lastY);
if(smooth > 0) smooth = Math.ceil(smooth);
else smooth = Math.floor(smooth);
if (IE) NM.pixelTop+=smooth;
if (NS) NM.top+=smooth;
lastY = lastY+smooth;}
setTimeout('makeStatic("smooth")', 1)}
else if (mode=="advanced") {
if ((IE||NS) && winY>YOffset-staticYOffset) {
if (IE) {NM.pixelTop=winY+staticYOffset}
if (NS) {NM.top=winY+staticYOffset}}
else {
if (IE) {NM.pixelTop=YOffset}
if (NS) {NM.top=YOffset-7}}
setTimeout('makeStatic("advanced")', 1)}}
function init() {
if (IE) {
ssm2.style.pixelLeft = -menuWidth;
ssm2.style.visibility = "visible"}
else if (NS) {
document.ssm2.left = -menuWidth;
document.ssm2.visibility = "show"}
else {alert('Choose either the "smooth" or "advanced" static modes!')}}
este menu esta muy bien, lo que no se como hacer para ponerlo en una pagina con dos marcos y al pulsar sobre cualquier enlace me lo habra en el marco principal y no en una pagina nueva en blanco, no se si me explico muy bien.
este menu esta muy bien, lo que no se como hacer para ponerlo en una pagina con dos marcos y al pulsar sobre cualquier enlace me lo habra en el marco principal y no en una pagina nueva en blanco, no se si me explico muy bien.
gracias Alfredo, pero con este comando lo que estoy consiguiendo es que me habra una bentana nueva al pulsar cualquier enlace y no en el frame de la derecha que es lo que estoy buscando
Anda que no nos complicamos la vida ni na por no mirar bien las cosas:
si te fijas sobre la linea 25: linkTarget, hay esta la solucion, solo hay que poner a donde quieres que te la abra y solucionado, despues de darle tantas vueltas.............
tu codigo esta muy bien diseñado sin embargo solo funciona bien en el ms internet explorer, a mi me agradaria que funcione en cualquier navegador, por ejemplo lo probe en el mozilla firefox pero no se oculta el menu; bueno yo encontre un menu desplegable que si funciona en el firefox:
Es este:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css">
<!--
a.bi{
background-color:black;
color:#ffffff;
display:block;
font-family: MS Sans Serif,sans-serif;
font-size:8pt;
font-weight:bold;
padding:3px 3px 3px 3px;
text-decoration:none;
border-color: #225555 #000000 #000000 #225555;
border-style:solid;
border-width:2px;
}
a.bi:hover{
background-color:#f8f8f8;
color:black;
}
a.mi{
background-color:black;
color:#ffffff;
display:block;
font-family:MS Sans Serif,sans-serif;
font-size:8pt;
font-weight:bold;
padding: 2px 2px 2px 4px;
text-decoration:none;
}
a.mi:hover{
background-color:#f8f8f8;
color:black;
}
.mn{
background-color:black;
border-color: #225555 #000000 #000000 #225555;
border-style:solid;
border-width:2px;
z-index:100;
}
.sp{
BORDER-TOP:#000000 1px solid;
MARGIN:2px;
BORDER-BOTTOM:#225555 1px solid
}
//-->
</style>
<!--paste above inbetween your head tags-->
<!--Past below inbetween your body tags-->
<title>Documento sin título</title>
<meta http-equiv="" content="text/html; charset=iso-8859-1">
</head>
Enviado por prudenciano magaña garcia el día 2 de diciembre de 2005
Quiero felicitarlos por su excelente codigo de los menús porque realmente funciona y es muy elegante. de antemano muchas gracias y si pudieran enviarme a mi direccion de correo codigo de otro tipo de menus sería magnifico...
Foros de debate
Javascript
