HACER UN Men?? desplegable, con un simple bot??n – PARA BLOG

  • junio 6, 2010

Este men?? desplegable consiste en hacer clic al bot??n y se muestra una lista de opciones.

1. Ir a dise??o de la plantilla. Despu??s clic en Edici??n de HTML (no Expandir plantillas de artilugios) y agregas el siguiente c??digo entre <b:skin><![CDATA[ y ]]></b:skin>. Preferible que lo pegues casi al final (antes de ]]></b:skin>)

.texthidden {
display:inline
}

.shown {
display:block
}

2. Entre ]]></b:skin> y </head> agregar lo siguiente:

<script src=’http://andrewhonors.googlepages.com/fecha.js’ type=’text/javascript’/>

 Guardar cambios.

3. Ir a Elementos de la p??gina, clic en A??adir un elemento de p??gina y seleccionar HTML/Javascript. Ah?? tendr??n que agregar el siguiente c??digo:

<a href=»javascript:void(0);» onclick=»expandcollapse(‘musica’)»><img border=»0″ src=»http://direcci??n-de-la-imagen-del-bot??n»/></a><br/>

<ul id=»musica» class=»texthidden»>
<li><a href=»http://www.radioblogclub.com/» target=»_blank»>Radio Blog</a></li>
<li><a href=»http://www.goear.com/index.php» target=»_blank»>Goear</a></li></ul>

<a href=»javascript:void(0);» onclick=»expandcollapse(‘video’)»><img border=»0″ src=»http://direcci??n-de-la-imagen-del-bot??n»/></a><br/>

<ul id=»video» class=»texthidden»>
<li><a href=»http://www.youtube.com/» target=»_blank»>Youtube</a></li>
<li><a href=»http://www.veoh.com/» target=»_blank»>Veoh</a></li></ul>

**Como punto de partida hemos hecho un men?? de m??sica en el que aparece una lista: Radio Blog y Goear. Adem??s, hay un men?? de video en el que aparece: You Tube y Veoh

 En esta parte de c??digo puedes repetirla cuantas veces quieras, ustedes tendr??n que armarlo a su gusto.
 Solo tendr??n que agregar el bot??n, la direcci??n de la p??gina con su respectivo nombre.
– Adem??s, puedes a??adir una imagen justo antes del texto que aparece la lista.

Explicaci??n:
– Si por ejemplo, a parte de m??sica deseamos poner video entonces al crear otro bot??n, en expandcollapse(‘musica’) cambiamos en donde dice m??sica por video. Adem??s, el id=???m??sica??? lo modificamos por video.
– En <img border=»0″ src=»http://direccion-de-la-imagen»/>, viene hacer la imagen del bot??n.
– En donde dice Radio Blog, Goear, You Tube, vienen a ser una lista.
– En <a href=»http://www.radioblogclub.com/» target=»_blank»>, viene hacer el enlace de la p??gina enlazada.

Ejemplo:

No Comments Found