Ver Mensaje Individual
  #4 (permalink)  
Antiguo 30/03/2011, 11:33
Avatar de laratik
laratik
 
Fecha de Ingreso: mayo-2010
Ubicación: Cali
Mensajes: 317
Antigüedad: 14 años, 9 meses
Puntos: 63
Respuesta: Menú como panel de YouTube

Rápidamente se me ocurre esto:

Código HTML:
Ver original
  1. <div id="target">CONTENIDO</div>
  2. <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />

Código CSS:
Ver original
  1. #target {
  2.     background: #00F;
  3.     color:#FFF;
  4.     text-align: center;
  5.     width: 500px;
  6.     left: 50%;
  7.     margin-left: -250px;
  8.     margin-top: 200px;
  9.     position: absolute;
  10. }

Código Javascript:
Ver original
  1. function fijar()
  2. {
  3.     variable = document.getElementById("target").offsetTop;
  4.     window.onscroll = cambioScroll;
  5. }
  6.  
  7. function cambioScroll(e)
  8. {
  9.     if(document.body.scrollTop >= variable) {
  10.         document.getElementById("target").style.position = "fixed";
  11.         document.getElementById("target").style.marginTop = "0px";
  12.     } else {
  13.         document.getElementById("target").style.position = "absolute";
  14.         document.getElementById("target").style.marginTop = "200px";
  15.     }
  16. }

Claro que lo puedes mejorar, pero para dar una guia no creo que este mal.
__________________
Programar apasiona y lo que apasiona es un arte, por lo tanto programar es un arte.

Quiero karma para en mi próxima vida ser un billonario bien dotado con alas.