ruta en menu desplegable

Muy buenas, quiero poner la ruta en los menus despegables, es decir, que al abrir el menu desplegable, pinche en uno de ellos y me vaya a otra de las paginas que yo he creado.

Lo he mirado bien en el tutorial, pero no me sale. Creo que es en Definir menus y dentro en ´ruta´ pero que ruta pongo? solo así: plantilla.html o tengo que poner <a href=plantilla.html a>

estoy hecho un lio. auyda please.

gracias de antemano.
joseyma escribió:Muy buenas, quiero poner la ruta en los menus despegables, es decir, que al abrir el menu desplegable, pinche en uno de ellos y me vaya a otra de las paginas que yo he creado.

Lo he mirado bien en el tutorial, pero no me sale. Creo que es en Definir menus y dentro en ´ruta´ pero que ruta pongo? solo así: plantilla.html o tengo que poner <a href=plantilla.html a>

estoy hecho un lio. auyda please.

gracias de antemano.

Hola:

Depende de donde quiere que sea ese enlace, si en su desplegable, por ejemplo el que está más a la izquierda en su capa navegación solo tiene Secciones hacia abajo y no tiene Sub-secciones, entonces donde dice seccion 1, allí debe poner por ejemplo Principal, y donde dice ruta, poner plantilla.html. para que al pinchar en Principal, le lleve a la plantilla

Ahora si su desplegable tiene subsecciones, pues pone por ejemplo donde dice sub-seccion 2.1 un nombre que se refiera a lo que habla la página, y donde dice ruta, allí pone el nombre de esa página

Acá le dejo los dos ejemplos


if (TransMenu.isSupported())
{
var ms=new TransMenuSet(TransMenu.direction.down,1,0, TransMenu.reference.bottomLeft);

var desplegable1 = ms.addMenu(document.getElementById('desplegable1'));
desplegable1.addItem('Seccion 1','ruta');
Esta de arriba es una Seccion, o sea la primera casilla que se abre hacia abajo, donde dice Seccion 1, puede poner Principal y donde dice ruta allí pone el nombre de su pagina por ejemplo plantilla.html


A continuación hacia abajo está la casilla Seccion 2, imaginese que esa Seccion 2 tiene tres Subsecciones, y usted tiene tres paginas más (fuera de la Principal o plantilla.html) que hablan de las razas de perros, entonces donde dice Seccion 2 puede poner Razas de perros
solo allí , ya que donde dice ruta entonces no habria que poner nada porque para eso esa Seccion 2 tiene tres subsecciones.

Así que en la Subseccion 2.1 puede poner Caniche y donde dice ruta allí pone el nombre de la pagina que habla de los caniches, y en la Subseccion 2.2 puede poner donde dice Subseccion 2.2 por ejemplo Doberman, y donde dice ruta , el nombre de la pagina que habla de los Doberman, y en la Subseccion 2.3 pues Pastor alemán y en ruta paginacuatro.html

desplegable1.addItem('Seccion 2','ruta');
var desplegable1_0 = desplegable1.addMenu(desplegable1.items[1]);

desplegable1_0.addItem('Sub-seccion 2.1','ruta');

desplegable1_0.addItem('Sub-Seccion 2.2','ruta');

desplegable1_0.addItem('Sub-Seccion 2.3','ruta');
desplegable1.addItem('Seccion 3','ruta');

TransMenu.renderAll();
}
...... .... ....
Este es el ejemplo
if (TransMenu.isSupported())
{
var ms=new TransMenuSet(TransMenu.direction.down,1,0, TransMenu.reference.bottomLeft);

var desplegable1 = ms.addMenu(document.getElementById('desplegable1'));
desplegable1.addItem('Principal','plantilla.html');
desplegable1.addItem('Razas','ruta');
var desplegable1_0 = desplegable1.addMenu(desplegable1.items[1]);

desplegable1_0.addItem('Caniche','caniche.html');

desplegable1_0.addItem('Doberman','pagina3.html');

desplegable1_0.addItem('Sub-Seccion 2.3','ruta');

desplegable1.addItem('Seccion 3','ruta');

TransMenu.renderAll();
}
.... ..... ....

Saludos
Agradecido de los que aprenden enseñando
Sigo con el problema: no soy capaz de poner un enlace a un menu despegable.


le pongo los codigos para que les echen un vistazo:

PAGINA DONDE ESTAN LOS MENUS DESPLEGABLES:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>MALASOMBRA | La Web del músico cordobés</title>

<link rel="stylesheet" href="estilo-letras-de-canciones.css" type="text/css" media="all">
<link rel="stylesheet" href="estilo-menu-desplegable.css" type="text/css" media="all">
<script language="javascript" src="no-tocar.txt" type="text/javascript"></script>
<script language="javascript" src="numero-de-menus.txt" type="text/javascript"></script>


</head>

<style>
.menu {font: bold 20px;color: white}
</style>

<body onload="init();">

<div id="global">

<div id="cabecera">

<div id="logotipo">
[contenido no disponible]

<div id="publicidad"></div>
</div>


<div id="navegacion">
<ul>
  • MALASOMBRA
  • UNA VIDA PERDIDA
  • NOVEDADES

    </div>


    <div id="contenido">

    <h1>LETRAS DE CANCIONES</h1>




    Aqui podeis encontrar las letras de las canciones, ordenadas por maquetas. </p>


    <p/class="center">VOLVER</p>
    </div>

    <div id="pie">
    <div id="pieuno">&#169 MALASOMBRA</div>
    <div id="piedos">

    <a id="mws4585106" href="http://webstats.motigo.com/">
    [contenido no disponible]</a>
    <script src="http://m1.webstats.motigo.com/c.js?id=4585106" type="text/javascript"></script>

    </div>

    <div id="pietres"></div>
    </div>

    <script language="javascript" src="definir-menus.txt" type="text/javascript"></script>

    </body>
    </html>

    ESTILO DE ESA PAGINA:

    * {margin:0px ; padding:0px ; border: 0px}

    body {margin: 0px 0px 0px 0px; background-color:black}

    body {text-align: center}

    #global {width:800px ; margin: 4px auto }

    #cabecera {background-color:black}

    #logotipo {background-color: black; float:center}
    #publicidad {background-color: black}


    #navegacion {background-color: black ;border: black 1px solid ;height:230px; font: normal 22px 10px Times New Roman ; padding: 10px 0px 10px 0px}
    #navegacion li {float:left ; list-style:none ; margin: 0px 5px 0px 10px; list-align: center}
    #navegacion ul { margin-left: 1px }



    #contenido {background-color: black;border:3px double white}
    #contenido p {padding: 5px 10px 5px 10px; color: white; text-align: center; text-indent: 20px; text-decoration: none; font-family: Times New Roman; font-size: 18px}


    <div id="pie">Este es el pié de página</div>

    p {text-align: justify}

    h1 {font-size: 1.6em; color:red ; font-weight: bold ; text-decoration: underline ; text-align: center; padding: 10px 10px 10px 10px}
    h2 {font.size: 1.1em; color:white ; font-weight: bold ; text-decoration: none ; text-align: left; padding: 10px 10px 10px 10px}


    #pie {color: white; float: center}
    #pieuno {float: center}
    #piedos {float: right}
    #pietres {float: left}

    CODIGO DEFINIR MENUS.TXT:

    if (TransMenu.isSupported())
    {
    var ms=new TransMenuSet(TransMenu.direction.down,1,0, TransMenu.reference.bottomLeft);

    var desplegable1 = ms.addMenu(document.getElementById('desplegable1'));
    desplegable1.addItem('CANCION 1','ruta');
    desplegable1.addItem('CANCION 2','ruta');
    desplegable1.addItem('CANCION 3','ruta');
    desplegable1.addItem('CANCION 4','ruta');
    desplegable1.addItem('CANCION 5','ruta');
    desplegable1.addItem('CANCION 6','ruta');
    desplegable1.addItem('CANCION 7','ruta');
    desplegable1.addItem('CANCION 8','ruta');
    desplegable1.addItem('CANCION 9','ruta');


    var desplegable2 = ms.addMenu(document.getElementById('desplegable2'));
    desplegable2.addItem('Entre suspiro y suspiro','entre-suspiro-y-suspiro.html');
    desplegable2.addItem('La dueña del bar','ruta');
    desplegable2.addItem('No quiero verte más','ruta');
    desplegable2.addItem('Que refleje la luna','ruta');
    desplegable2.addItem('Una vida perdida','ruta');
    desplegable2.addItem('Lágrimas','ruta');
    desplegable2.addItem('Soledad','ruta');
    desplegable2.addItem('Por querer olvidarte','ruta');
    desplegable2.addItem('Cada vez que me miras','ruta');


    var desplegable3 = ms.addMenu(document.getElementById('desplegable3'));
    desplegable3.addItem('Nada es como ayer','ruta');


    TransMenu.renderAll();
    }

    ESTILO MENU DESPLEGABLE:

    /* this is the clipping region for the menu. it's width and height get set by script, depending on the size of the items table */
    .transMenu {
    position:absolute;
    overflow:hidden;
    left:-1000px;
    top:-1000px;
    text-align: left;
    }

    /* this is the main container for the menu itself. it's width and height get set by script, depending on the size of the items table */
    .transMenu .content {
    position:absolute;
    }

    /* this table comprises all menu items. each TR is one item. It is relatively positioned so that the shadow and background transparent divs can be positioned underneath it */
    .transMenu .items {
    position:relative;
    left:0px; top:0px;
    border:1px solid #999;
    z-index:2;
    }

    .transMenu.top .items {
    border-top:none;
    }

    /* each TR.item is one menu item */
    .transMenu .item {
    color:red;
    background-image: url(objetos/fondo-no-activo.gif);
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    font-weight: bold;
    text-decoration:none;
    /* this is a hack for mac/ie5, whom incorrectly cascades the border properties of the parent table to each row */
    border:none;
    cursor:pointer;
    cursor:hand;
    }

    /* this DIV is the semi-transparent white background of each menu. the -moz-opacity is a proprietary way to get transparency in mozilla, the filter is for IE/windows 5.0+. */
    /* we set the background color in script because ie mac does not use it; that browser only uses a semi-transparent white PNG that the spacer gif inside this DIV is replaced by */
    .transMenu .background {
    position:absolute;
    left:0px;
    top:0px;
    z-index:1;
    -moz-opacity:.8;
    filter:alpha(opacity=95);
    }

    /* same concept as .background, but this is the sliver of shadow on the right of the menu. It's left, height, and background are set by script. In IE5/mac, it uses a PNG */
    .transMenu .shadowRight {
    position:absolute;
    z-index:3;
    top:3px; width:2px;
    -moz-opacity:.4;
    filter:alpha(opacity=40);
    }

    /* same concept as .background, but this is the sliver of shadow on the bottom of the menu. It's top, width, and background are set by script. In IE5/mac, it uses a PNG */
    .transMenu .shadowBottom {
    position:absolute;
    z-index:1;
    left:3px; height:2px;
    -moz-opacity:.4;
    filter:alpha(opacity=40);
    }

    /* this is the class that is used when the mouse is over an item. script sets the row to this class when required. */
    .transMenu .item.hover {
    background-image: url(objetos/fondo-activo.gif);
    color:white;
    }

    /* this is either the dingbat that indicates there is a submenu, or a spacer gif in it's place. We give it extra margin to create some space between the text and the dingbat */
    .transMenu .item img {
    margin-left:10px;
    }
    .textoNoIdent {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #333333;
    text-decoration: none;
    }
    .formError {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #333333;
    border-top: 1px solid #C4CCCC;
    border-right: 1px solid #ACB5B5;
    border-bottom: 1px solid #6F7777;
    border-left: 1px solid #ACB5B5;
    padding: 2px 0 2px 0.25em;
    background-color: #F5E984;
    }
    .txtError {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: bold;
    color: #990000;
    background-color: #E9E9E9;
    padding: 5px;
    text-align: justify;
    }


    La verdad es que no se si me explico bien, lo voy a intentar con un ejemplo: si entran en mi pagina y se van a letras de canciones veran que en los menus de arriba (que son nombres de maquetas de musica) se abren despegables con los nombres de las canciones. Yo lo que quiero es que una vez abierto pueda pinchar en una canión y se vaya a otro enlace html(que previamente he creado) y se abra.

    Muchas gracias por todo.

    PD: recuerdo que tb tengo el problema de centrar los menus, que aun no se como hacerlo.
  • Hola:

    Veo que me expliqué bastante mal anteriormente, acá le dejo el como tendría yo los códigos para esos tres menus desplegables del archivo definir menus

    if (TransMenu.isSupported())
    {
    var ms=new TransMenuSet(TransMenu.direction.down,1,0, TransMenu.reference.bottomLeft);

    var desplegable1 = ms.addMenu(document.getElementById('desplegable1'));
    desplegable1.addItem('Cancion 1','ruta');
    var desplegable1_0 = desplegable1.addMenu(desplegable1.items[0]);
    desplegable1_0.addItem('La vida es bella','letracancionuno.html');


    desplegable1.addItem('Cancion 2','ruta');
    var desplegable1_0 = desplegable1.addMenu(desplegable1.items[1]);
    desplegable1_0.addItem('La vida no es bella','letra-canc-2.html');


    desplegable1.addItem('Cancion 3','ruta');
    var desplegable1_0 = desplegable1.addMenu(desplegable1.items[2]);
    desplegable1_0.addItem('Por siempre','letra-canc-3.html');


    desplegable1.addItem('Cancion 4','ruta');
    var desplegable1_0 = desplegable1.addMenu(desplegable1.items[3]);
    desplegable1_0.addItem('Cada vez','letra-can-4.html');


    desplegable1.addItem('Cancion 5','ruta');
    var desplegable1_0 = desplegable1.addMenu(desplegable1.items[4]);
    desplegable1_0.addItem('Otro amor','letra-can-5.html');

    desplegable1.addItem('Cancion 6','ruta');
    var desplegable1_0 = desplegable1.addMenu(desplegable1.items[5]);
    desplegable1_0.addItem('El mismo','letra-can-6.html');

    desplegable1.addItem('Cancion 7','ruta');
    var desplegable1_0 = desplegable1.addMenu(desplegable1.items[6]);
    desplegable1_0.addItem('Sub-Seccion 6.1','ruta');

    desplegable1.addItem('Cancion 8','ruta');
    var desplegable1_0 = desplegable1.addMenu(desplegable1.items[7]);
    desplegable1_0.addItem('Sub-Seccion 6.1','ruta');

    desplegable1.addItem('Cancion 9','ruta');
    var desplegable1_0 = desplegable1.addMenu(desplegable1.items[8]);
    desplegable1_0.addItem('Sub-Seccion 6.1','ruta');




    var desplegable2 = ms.addMenu(document.getElementById('desplegable2'));
    desplegable2.addItem('Entre suspiro y suspiro','pagina-a.html');
    desplegable2.addItem('Seccion 2','pagina-b.html');
    desplegable2.addItem('No querer verte más','pagina-c.html');
    desplegable2.addItem('Seccion 4','ruta');
    desplegable2.addItem('Una vida perdida','pagina-e.html');
    desplegable2.addItem('Lágrimas','pagina-f.html');
    desplegable2.addItem('Seccion 7','ruta');
    desplegable2.addItem('Seccion 8','ruta');
    desplegable2.addItem('Cada vez que me miras','pagina-i.html');



    var desplegable3 = ms.addMenu(document.getElementById('desplegable3'));
    desplegable3.addItem('Novedades','pagina-n.html');




    TransMenu.renderAll();
    }



    Donde dice :
    Cancion 1
    Cancion 2
    Cancion 3
    Cancion 4
    Cancion 5
    Cancion 6
    Cancion 7
    Cancion 8
    Cancion 9
    Allí no hay que ponerle ruta, ya que para eso tiene la Subseccion
    Y en la Subseccion se le pone el nombre de la cancion y en ruta (de la subseccion) se le pone el nombre de la página en que está la letra de esa cancion.

    El desplegable que se llama Una vida Perdida

    Como no tiene Subsecciones
    entonces si hay que ponerle la ruta, ya que como aparece el nombre de la cancion, por lo tanto al lado donde dice ruta, allí se le pone el nombre de la página en que está la letra de esa cancion, para que al pulsar en el nombre, de esa canción, le lleve a la página en que está la letra.

    Ahora si en el desplegable "Una vida perdida" donde salen hacia abajo los nombre de las canciones, y quiere que al pulsar en una de esos nombres, le lleve a escuchar la canción, eso deberá esperar que alguien que lo haya hecho le diga que se pone en la ruta de esa cancion. (A mi me gusta más el silencio)

    En algunas Subsecciones hay algunos que no puse para que se diera cuenta de donde hay que poner el nombre de la cancion y donde hay que poner la ruta

    Saludos

    Lo de centrar, ya se arreglará,.

    Le comentaré acerca de los arreglos que se hacen cuando hay errores en una página.
    Si alguien hace una pregunta, por que algo no le resulta, la respuesta a esa pregunta, no suele ser mágica.

    Quiero decir que si uno sugiere algo, eso no significa que inmediatamente se arreglará el problema, porque seguramente los errores se han acumulado, entonces hay que ir de a poco solucionando las cosas.

    Como por ejemplo, le sugerí que le cambiara el nombre al archivo no-tocar, y le pusiera transMenu.txt, si lo hizo, eso es parte de la solución, si no lo hizo porque vió que ni aún así se arreglaba el problema, es que debe saber que no es esa una sugerencia para arreglar inmediatamente el problema, solo es una sugerencia para ir arreglándo el problema

    Espero que con los códigos que le dejé pueda seguir avanzándo algo más.
    Saludos