Flux Slider
Flux Slider es un plugin de jQuery que nos permite montar sliders con tremendas transiciones en 2D y 3D.
Necesita ser visto en un navegador que soporte CSS3 ya que se utiliza esta tecnología para realizar los efectos de transición. Por ejemplo en Internet Explorer 7 no funciona.
Para implementarlo en tu Web tan solo necesitarás añadir en el <head> de tu página la librería jQuery, el plugin y su llamada + los estilos que tu desees, como por ejemplo:
<link rel="stylesheet" href="css/demo.css" type="text/css" media="screen" title="no title" charset="utf-8">
<script src="../jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="js/flux.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
$(function(){
if(!flux.browser.supportsTransitions)
alert("Flux Slider requires a browser that supports CSS3 transitions");
window.f = new flux.slider('#slider', {
pagination: true,
transition: cube
});
});
</script>
Y seguidamente en el <body> añadimos dentro de un tag section de HTML5 el contenedor con el slider de imágenes.
<section class="container"> <h1><span class="flux">Flux</span> <span>Slider</span></h1> <h2>Hardware accelerated image transitions using CSS3.</h2> <div id="slider"> <img src="img/avatar.jpg" alt="" /> <img src="img/ironman.jpg" alt="" /> <img src="img/tron.jpg" alt="" /> <img src="img/greenhornet.jpg" alt="" /> </div> </section>
Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
¿Buscas trabajo de programador?
5 respuestas a “Flux Slider”
Deja una respuesta
41 artículos que te podrían interesar
Ver más sobre
hola.
he estado intentando ocupar flux-slider utilizando de forma responsiva
Espero me puedan apoyar
Hola,
No tiene pinta que el autor de este plugin haya adaptado este slider a todos los dispositivos. De todas formas, lo puedes revisar en la Web del autor: https://github.com/joelambert/Flux-Slider
Saludos
Como puedo realizar animaciones, para exposiciones, existe un manual, video tutorial gracias
donde puedo modificar el tamaño …!!!
agradeceria tu respuesta
En la siguiente url lo tienes:
https://github.com/joelambert/Flux-Slider