Carrousel jQuery bxCarousel

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 *

*

un × cinq =

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 ?