Carrousel jQuery bxCarousel

Un nouveau venu dans l’univers des carrousels jQuery, voici bxCarousel.

bxCarousel est un carrousel jQuery simple à mettre en place en place, utilisant
une liste non ordonnée d’élément (ul li).

Fonctionnalités:

  • – choix du nombre d’élément à afficher
  • – mode automatique ou manuel au choix
  • – contrôleurs suivant/précédent
  • – choix du nombre d’élément à déplacer
  • – vitesse de transition
  • – direction de transition

HTML

<ul>
<li>premier élément</li>
<li>deuxième élément</li>
<li>troisième élément</li>
<li>nombre illimité d'élément</li>
</ul>

jQuery

$(document).ready(function(){
$('ul').bxCarousel({
display_num: 4,       // number of elements to be visible
move: 4,              // number of elements to the shift the slides
speed: 500,           // number in milliseconds it takes to finish slide animation
margin:0,             // right margin to be applied to each <li> element (in pixels, although do not include "px")
auto: false,          // automatically play slides without a user click
auto_interval: 2000,  // the amount of time in milliseconds between each auto animation
auto_dir: 'next',     // direction of auto slideshow (options: 'next', 'prev')
auto_hover: false,    // determines if the slideshow will stop when user hovers over slideshow
next_text: 'next',    // text to be used for the 'next' control
next_image: '',       // image to be used for the 'next' control
prev_text: 'prev',    // text to be used for the 'prev' control
prev_image: '',       // image to be used for the 'prev' control
controls: true        // determines if controls will be displayed
});
});

Fonctionne sur la plupart des navigateurs
Site Officiel http://bxcarousel.com/

A voir aussi :
http://bxslider.com/
http://bxgalleryplugin.com/

Aucun commentaire

Répondre

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

*

trois × 3 =

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

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 ?