TinyFader2 is a 2KB JavaScript slider code that is completely configurable through robust options. It is an upgrade to the previous TinyFader version adding a number of requested features and making additional improvements. It gracefully degrades without JavaScript support and is totally customizable using CSS.
Here are the current features:
- CSS3 hardware transition support for Firefox and Webkit browsers
- Automatic or manual slide rotation
- Option to resume play after interruption
- Toggle to pause auto play on slide hover
- Set the initial slide index with a parameter
- Pass a navigation ID of a list and have the script bind either click or hover events for navigating the slideshow
- Ability to move to previous or next slide
- Functions to play and pause the automatic slideshow
- Parameter to set the transition duration
To initialize the script use the following:
var ss = new TINY.fader.init("ss", { id: "slides", // ID of the slideshow list container position: 0, // index where the slideshow should start auto: 0, // automatic advance in seconds, set to 0 to disable auto advance resume: true, // boolean if the slideshow should resume after interruption navid: "pagination", // ID of the slide nav list activeClass: "current", // active class for the nav relating to current slide pauseHover: true, // boolean if the slideshow should pause on slide hover navEvent: "click", // click or mouseover nav event toggle duration: .25 // duration of the JavaScript transition in seconds, else the CSS controls the duration, set to 0 to disable fading });The first parameter is the variable name used for the object instance. This script has been tested in all major browsers and is available free of charge for both personal or commercial projects under the GNU GPL v3.0 license.
No hay comentarios:
Publicar un comentario