SprintDevelop.com - Diseño y desarrollo web - Diseño, desarrollo web,Aplicaciones Móviles, TabletasSprintDevelop.com - Diseño y desarrollo web
Mostrando Codigo - Dhtml
Code

Dhtml - Menu Flotante

Códigos Dhtml

Sencillo menu flotante 100% customizable
Visitas: 35,937 - 6/12/2003
DemoNO CONTIENE ARCHIVO DESCARGABLEComentario
EXPLICACION
Sencillo menu flotante 100% customizable
CODIGO
Este codigo aun no ha sido probado por Tutores.org en ChromeEste codigo aun no ha sido probado por Tutores.org en FirefoxCodigo probado en Internet Explorer 7+Este codigo aun no ha sido probado por Tutores.org en OperaEste codigo aun no ha sido probado por Tutores.org en Safari


<!-- Codigo ofrecido por Tutores.org -->

  1. <script>
  2. if (!document.layers)
  3. document.write('<div id="divStayTopLeft" style="position:absolute">')
  4. </script>
  5.  
  6. <layer id="divStayTopLeft">
  7.  
  8. <!--Parte editable del menu-->
  9. <table border="1" width="130" cellspacing="0" cellpadding="0">
  10.   <tr>
  11.     <td width="100%" bgcolor="#CC0000">
  12.       <p align="center"><b><font color="#FFFFFF" size="4">Menu</font></b></td>
  13.   </tr>
  14.   <tr>
  15.     <td width="100%" bgcolor="#FFFFFF">
  16.       <p align="left"> <a href="http://www.google.com">Google</a><br>
  17.         <a href="http://www.altavista.com">Altavista</a><br>
  18.         <a href="http://www.yahoo.com">Yahoo.com</a><br>
  19.         <a href="javascript:;window.print()">Imprimir Pagina</a><br>
  20.         <a href="javascript:;window.close()">Cerrar Pagina</a></td>
  21.   </tr>
  22. </table>
  23. <!--Fin de Edicion-->
  24.  
  25. </layer>
  26.  
  27.  
  28. <script type="text/javascript">
  29.  
  30. /*
  31. Script traducido para uso en  tutores.org
  32. Floating Menu script-  Roy Whittle (http://www.javascript-fx.com/)
  33. Script featured on/available at http://www.dynamicdrive.com/
  34. This notice must stay intact for use
  35. */
  36.  
  37. //Indicamos la verticalidad Fromtop - Desde arriba     o     frombottom - desde abajo
  38. var verticalpos="frombottom"
  39.  
  40. if (!document.layers)
  41. document.write('</div>')
  42.  
  43. function JSFX_FloatTopDiv()
  44. {
  45.     var startX = 3,
  46.     startY = 150;
  47.     var ns = (navigator.appName.indexOf("Netscape") != -1);
  48.     var d = document;
  49.     function ml(id)
  50.     {
  51.         var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
  52.         if(d.layers)el.style=el;
  53.         el.sP=function(x,y){this.style.left=x;this.style.top=y;};
  54.         el.x = startX;
  55.         if (verticalpos=="fromtop")
  56.         el.y = startY;
  57.         else{
  58.         el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
  59.         el.y -= startY;
  60.         }
  61.         return el;
  62.     }
  63.     window.stayTopLeft=function()
  64.     {
  65.         if (verticalpos=="fromtop"){
  66.         var pY = ns ? pageYOffset : document.body.scrollTop;
  67.         ftlObj.y += (pY + startY - ftlObj.y)/8;
  68.         }
  69.         else{
  70.         var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
  71.         ftlObj.y += (pY - startY - ftlObj.y)/8;
  72.         }
  73.         ftlObj.sP(ftlObj.x, ftlObj.y);
  74.         setTimeout("stayTopLeft()", 10);
  75.     }
  76.     ftlObj = ml("divStayTopLeft");
  77.     stayTopLeft();
  78. }
  79. JSFX_FloatTopDiv();
  80. </script>



ENLACE AL CODIGO
Si quieres enlazar desde tu pagina a este codigo
<!-- Inicio enlace Tutores.org -->
<a title="Tutores.org - Menu Flotante" href="http://www.tutores.org/codigo/385/" target="_blank">Menu Flotante</a>
<!-- Final enlace Tutores.org -->
COMENTARIOS
Comentario usuario
harold rodríguez
5 5
Buen código, pero no funciona en internet explorer. gracias.
Comentario usuario
13-11-2007 12:52:07
4 5
Deberían insertar el ejemplo del scrip
Comentario usuario
seba_27_bs
1 5
buenisimo maestro ...funciona muy bien.
Comentario usuario
22-07-2009 19:23:13
1 5
a mi no me funciona tengo el xplore
Comentario usuario
Franco_mweper
2 5
Hola a todos:

Muy bueno el code. Me recontra sirvió.
Gracias por la ayudita.

[url=http://mweper.es.tl/][img]http://img.webme.com/pic/m/mweper/userbar-mweper-2009.png[/img][/url]
Comentario usuario
15/02/2005 20.54.27
5 5
Muy bueno el codigo... funciona Ok...

Gracias
Comentario usuario
etzekiel
4 5
Y el ejemplo? que es eso de:Tu comentario debe de contener al menos 20 caracteres. puras fallas.
INSERTAR COMENTARIO

Usuario:
Email:
Comentario:
Codigo Seguridad

Antes de enviar un comentario...
Todos los comentarios son revisados personalmente
Todo comentario que no haga relacion al codigo mostrado en esta pagina sera eliminado
Usuarios registrados tienen preferencia en recibir respuestas de ayuda!!
Ademas de poder insertar Imagenes,Enlaces y otras propiedades del editor.
Por favor, insertar los comentarios descriptivos.