wrapScroll: Desplazamiento automático de DIV’s

4
1770

Haber, para entender esto mejor vamos a suponer que deseamos mostrar un aviso "importante" a nuestro navegantes y (debido a su importancia) queremos que ese aviso (dentro de un DIV) se mueva a medida que el usuario se desplaza verticalmente por la página. Bien, para ello existe una librería hecha en Javascript: wrapScroll.

Uso básico

Primero descargamos la librería, y ubicamos el archivo wrapscroll.js y lo referenciamos en nuestra página html.

 <script type="text/javascript" src="wrapscroll.js"></script>

Iniciamos el método wrapScroll donde indicaremos el div que se desplazara.

 <script type="text/javascript">
new wrapScroll("midiv");
</script>

Creamos un hoja de estilo con los siguientes valores. Nota: para la etiqueta body la propiedad height le colocamos el valor 1200px para poder ver el efecto del desplazamiento.

#midiv{
position:absolute;
top:100px;
border:3px dashed red;
width:200px;
height:150px;
}
body{
height:1200px;
}

Esta librería funciona con:

  • InternetExplore 6.x, 7.0 o sup.
  • Firefox 1.5, 2.0 o sup.
  • Opera 9.x o sup.
  • Safari 1.2 o sup., Safari3.0 para Windows

[ Descargar este ejemplo ]

Hemos explicado la forma básica de usar esta excelente librería, sin embargo podemos añadirle otras funciones adicionales, como se puede observar en los siguientes ejemplos: 1, 2, 3, 4 y 5

4 COMENTARIOS

  1. Hola! te mando este mail porque encontré algo interesante:
    http://www.tufuncion.com/sorttable

    Estaría bueno si publican un post con su visión acerca de ése script, a mi me parece bárbaro ya que ahorra muchos recursos al hacer consultas a la base de datos cada vez que el usuario hace un click sobre un header de la tabla, me parece muy práctico, hoy lo implementé y anduvo de maravillas…

    Sin embargo parece que le encotraron bugs al ordenar números decimales. Espero que lo puedan analizar y sacar una conclusión al respecto para ver si es lo suficientemente útil como para publicarlo en esta excelente página.

    Un abrazo grande desde Mar del Plata, Argentina.

    Adios!!

    PD: escribo aquí porque en la sección de contacto no me envía el mensaje

  2. Hola

    Por qué será que en firefox no me funciona el wrapscroll.
    Qué me estará haciendo falta?, si me pueden colaborar se los agradecería

    Saludos

  3. eso es lo curioso jesus, que los ejemplos los visualizo en firefox y funcionan, pero mi implementacion la corro en IE y corre bien pero en firefox no me funciona, me debe estar haciendo falta algo pero no se que, que sabes o saben acerca de firefox, me dicen qeu es muy exigente con los objetos que uno referencia, que se les debe dar el name y el id, pero que mas podria hacerle falta.

    Muchas Gracias

Comments are closed.