como agregar un gadget a una pagina html?

ozmar_11 · #1 (**permalink**) 30/12/2011, 22:44

hola etoy haciendo una pagina html y necesito agregarle un gadget HTML/Javascript pero no se que etiquetas debe llevar o donde debe llevarlas este es el codigo gadget.

<ul style="display:none; visibility:hidden;" class="bsm" id="byslidemenu">
<li></li></ul>

<ul class="bsm vertical" id="verticalmenu">
<li class="first"><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
</ul>

nota: por si no me explique bien quiero hacer menu de esta pagina: http://ciudadblogger.com/2010/06/men...on-efecto.html pero a diferencia de esa pagina yo quiero agregar el menu a una pagina html que estoy haciendo. de antemano muchas gracias.

nilburcion · #2 (**permalink**) 02/01/2012, 09:06

El código que buscas es este:

Código HTML:

<html>

<head>
<script src='mootools-core.js' type='text/javascript'/>
<script src='byslidemenu.js' type='text/javascript'/>
<style type='text/css'>
ul.bsm{
margin: 0px auto;
border:1px solid #B0B0B0;
list-style-type: none;
}
ul.bsm li{
border-left:2px solid #FFFFFF;
}
ul.bsm li.first{
border-style: none;
}
ul.vertical li,
div.vertical div{
border-top: 2px solid #FFFFFF;
border-left-style: none;
}
</style>
</head>

<body>


<script type='text/javascript'>
window.addEvent('load', function(){
var slideMenu = new BySlideMenu();
var verticalmenu = new BySlideMenu('verticalmenu', {vertical: true});
}); 
</script>
<ul style="display:none; visibility:hidden;" class="bsm" id="byslidemenu">
<li></li></ul>

<ul class="bsm vertical" id="verticalmenu">
<li class="first"><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
</ul>

</body>
</html>

Aparte de esto tienes que descargarte este [URL="http://dl.dropbox.com/u/647003/CiudadBlogger/Scripts/Mootools_Byslidemenu.rar"]archivo[/URL] y subirlo a la misma carpeta de donde esté la pagina html.