Alfredo Artiles vuelve a regalarnos una nueva herramienta para MooTools que nos permite controlar el scroll que hacemos accionando un evento a medida que lo estamos haciendo, e24ScrollEvents.
Muy similar al desarrollado por David Walsh (ScrollSpy) que vimos hace unos días, pero enfocado para ser más fácil de usar y de implementar en nuestras aplicaciones. Para ello, usa un sistema basado en eventos asociados a elementos, de este modo los elementos podrán tener los eventos «visible» y «hidden» que serán lanzados a medida que vamos haciendo scroll y el elemento esté «visible» o «hidden» (oculto).
Ejemplo
// Definimos el monitor del scroll
new e24ScrollEvents({
container: window,
mode: 'vertical',
elements: ['el1', 'el2'] // Elementos relacionados al scroll.
});
// Eventos que serán accionados en el scroll
var el1 = $('el1');
el1.addEvents({
'visible': function() {
el1.setStyle('border', '4px solid #000');
},
'hidden': function() {
el1.setStyle('border', 'none');
}
});
// Eventos que serán accionados en el scroll
var el2 = $('el2');
el2.addEvents({
'visible': function() {
el2.setStyle('border', '4px solid #000');
},
'hidden': function() {
el2.setStyle('border', 'none');
}
});
Demo y Descargar
Puedes echarle un vistazo a las dos demos que Alfredo nos ha dejado y descargar código directamente desde su página.
1 comentarios, 0 referencias
+
#