Contenido

Easy Scroll, Scroll accesible para tu contenido

8 Abr

+ 6

Easy Scroll es una script desarollado en Javascript, que nos permite convertir un elemento contenedor de nuestro contenido en otro en el que podamos gestionar mediante botones el movimiento sobre el texto.

Además se trata de un sistema accesible, en el que al no detectar Javascript, no nos imposibilita el poder leer el contenido.

Instalación

Insertamos en el <head> de nuestra aplicación la llamada oportuna al script.

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

Una vez asegurados de que está debidamente cargada, podremos proceder a editar la estructura de nuestro contenido. Únicamente tendremos que englobar al contenido con un elemento al que le indicaremos un identificador único.

<div id="easy_scroll">
<!--  AQUI EL CONTENIDO -->
</div>

El siguiente paso, afectará directamente al fichero easyscroll.js, ya que tendremos que editarlo y modificar los parámetros siguientes:

var id = "myContent"; // Pondremos easy_scroll (o el id usado en el HTML)
var nav = ["Scroll Up", "Scroll Down", "Reset"]; //Nombres de los botones de navegación
var navId = ["btnUp", "btnDown", "btnReset"]; // ID's de los botones (para cambiarles el aspecto mediante CSS)
var speed = 5; //Velocidad de movimiento del scroll. (1 = lento, 10 = rápido).
var height = 200; //Tamaño del elemento visible.

[Descargar] [Demo]

Excelente post, salvo que no estoy en nada de acuerdo con ese tipo de efectos (no se porque me recuerda a flash). Aunque sea accesible, no es para nada usable.

Donde se ponga mi práctica, conocida y usable barra de scroll que se quite todo lo demás.

Date por seguro que lo usaré en alguno de mis futuros proyectos web.

Me ha parecido muy interesante y por supuesto útil.

Gracias por el post!

La verdad es que no soy capaz de hacerlo funcionar con Firefox.

En IE7 va como un tiro, y pese a que no me gustan este tipo de soluciones, reconozco, que cuando un cliente te pide algo como esto, es de lo mejorcito que he visto.

Saludos y gracias.

Finalmente he conseguido que funcione en Firefox. Realmente no lo hacía, porque los “botones” estaban por debajo de la capa contenidos, pero ya está solventado.

En mi caso, quería botones gráficos, no con texto, y eso me ha complicado un poco el trabajo.

Podéis ver el código, en http://www.josuizarra.es

Comentar

#

Me reservo el derecho de eliminar y/o modificar los comentarios que contengan lenguaje inapropiado, spam u otras conductas no apropiadas en una comunidad civilizada. Si tu comentario no aparece, puede ser que akismet lo haya capturado, cada día lo reviso y lo coloco en su lugar. Siento las molestias.


Cerrar
Enviar por Correo