RefineSlide slideshow 3d jQuery

refineslide jquery

RefineSlide est un nouveau petit plugin jQuery ultra léger pour créer simplement et rapidement des animations et diaporamas de type responsive.

Ce Slider utilise des propriétés CSS3 pour ses transitions qui sont de plus vraiment très sympas et nombreuses.
Au programme : Fade, Random, Slice horizontal, Slice vertical, Block scale, Kaleidoscope, Blind horizontal, Blind Vertical, Cube horizontal
3D, Cube vertical.

Caractéristiques :
– pas mal de transitions possibles
– Responsive
– CSS transition & 3D transform
– Javascript fallback fade transition
– Auto-formatted, responsive thumbnails
– Compatibilité navigateur (IE7+)
– HTML vignette
– Libre d’utilisation
– Simple d’utilisation et sémantique
– Poids: 12k compressé (4k gzip)

Exemple de code:
HTML

<ul>
    <li>
        <img src="img1.jpg" alt="" />
        <div>
            <!-- HTML contenu ici -->
        </div>
    </li>
    <li>
        <a href="#">
            <img src="img2.jpg" alt="" /> <!-- slide cliquable -->
        </a>
    </li>
</ul>

Javascript
$(document).ready(function () {
        $('.rs-slider').refineSlide({
            transition         : 'fade',
            transitionDuration : 7000,
            autoPlay           : true,
            keyNav             : false,
            delay              : 0,
            controls           : null
        });
    });

RefineSlide permet d’afficher des titres sur les vignettes.

Ce plugin peut être mis en auto-play, l’on peut définir le délai entre chaque slide.

A découvrir donc sur le site Officiel.

Aucun commentaire

Répondre

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

*

neuf − 4 =

CONTACT

We're not around right now. But you can send us an email and we'll get back to you, asap.

Envoi en cours...

©[current-year] WebCSSDesign

Se connecter

Oubli de mot de passe ?