2010-12-08 26 views
0

J'utilise ce plugin jQuery: http://www.thomaslanciaux.pro/jquery/jquery_carousel.htm pour créer un carrousel vertical.jQuery Carousel plugin passe au premier élément du clic

Je voudrais faire quelque chose de similaire à la pagination, où un bouton est cliqué et le cadre correspondant est défilé. Mais je veux seulement un bouton. Ce bouton viendra après la dernière image, et il se lira "retour en haut". Quand il est cliqué, il va défiler jusqu'au premier élément dans le carrousel. Quelqu'un sait comment je peux facilement déclencher cet événement?

+0

Dommage que vous ayez choisi ce plugin. Je l'aurais évité pour deux raisons: pas de documentation sauf pour la mise en place, et il n'y a pas de lien vers une source non compressée. –

Répondre

0

Je pense que vous voulez que le plugin jquery scrollTo: http://demos.flesler.com/jquery/localScroll/#section1

Le lien pour télécharger le plugin est sur la droite de cette page.

+0

Merci, mais je n'ai pas besoin d'un plugin pour ça. La fonctionnalité là-bas, j'ai besoin de trouver comment je peux le déclencher. –

2

J'ai écrit ce qui suit, ce que je pense est ce que vous essayez d'atteindre.

<html> 
<head> 
    <script type="text/javascript" src="http://sorgalla.com/projects/jcarousel/lib/jquery-1.4.2.min.js"></script> 
    <script type="text/javascript" src="http://sorgalla.com/projects/jcarousel/lib/jquery.jcarousel.min.js"></script> 

    <link rel="stylesheet" type="text/css" href="http://sorgalla.com/projects/jcarousel/skins/tango/skin.css" /> 


    <script type="text/javascript"> 

jQuery(document).ready(function() { 
    jQuery('#mycarousel').jcarousel(
    { 
     vertical: true, 
     scroll: 1 
    }); 

    // Loop through all images and attach click action 
    jQuery("#mycarousel img").each(function(index, element) 
    { 
     $(element).click(function() 
     { 
      jQuery('#mycarousel').jcarousel('scroll', index + 1); 
     }); 
    }); 
}); 

</script> 
</head> 

<body> 

<ul id="mycarousel" class="jcarousel jcarousel-skin-tango"> 
    <li><img src="http://static.flickr.com/66/199481236_dc98b5abb3_s.jpg" width="75" height="75" alt="" /></li> 
    <li><img src="http://static.flickr.com/75/199481072_b4a0d09597_s.jpg" width="75" height="75" alt="" /></li> 
    <li><img src="http://static.flickr.com/57/199481087_33ae73a8de_s.jpg" width="75" height="75" alt="" /></li> 
    <li><img src="http://static.flickr.com/77/199481108_4359e6b971_s.jpg" width="75" height="75" alt="" /></li> 
    <li><img src="http://static.flickr.com/58/199481143_3c148d9dd3_s.jpg" width="75" height="75" alt="" /></li> 
    <li><img src="http://static.flickr.com/72/199481203_ad4cdcf109_s.jpg" width="75" height="75" alt="" /></li> 
    <li><img src="http://static.flickr.com/58/199481218_264ce20da0_s.jpg" width="75" height="75" alt="" /></li> 
    <li><img src="http://static.flickr.com/69/199481255_fdfe885f87_s.jpg" width="75" height="75" alt="" /></li> 
    <li><img src="http://static.flickr.com/60/199480111_87d4cb3e38_s.jpg" width="75" height="75" alt="" /></li> 
    <li><img src="http://static.flickr.com/70/229228324_08223b70fa_s.jpg" width="75" height="75" alt="" /></li> 
</ul> 
</body> 
</html> 
+0

m'a aidé avec ce que je devais faire +1 – AdRock