How to Start/Stop jCarousel by external controls/e

2019-05-30 15:27发布

问题:

For a current project i need to trigger the Start/Stop Event of the jCarousel Plugin.

carousel.stopAuto();
carousel.startAuto();

I'm not that JavaScript addicted to solve the problem myself. A short explaination what i'm trying to do:

The carousel is a fancy product slider and works already as i expected. But the point is the product-description should be available as a tooltip. So i have to stop the carousel if an tooltip is shown and to restart it after the tooltip is closed. FYI: The tooltip Plugin is Cluetip. Does anyone have any suggestions for me?

回答1:

Found a solution. Use the following function as init callback for your carousel setup.

function initCarousel (carousel) {

    jQuery('#cluetip').live('mouseover mouseout', function(event) {       

        // Disable default action
        event.preventDefault();

        // Stop carousel at mouseover
        if (event.type == 'mouseover') {
            carousel.stopAuto();
        };

        // Restart carousel at mouseout
        if (event.type == 'mouseout') {
            carousel.startAuto()
        }; 
    });

};


回答2:

Try below code. It works fine for me :)

Ex :

function mycarousel_initCallback(carousel)
{
   carousel.clip.hover(function() {
        carousel.stopAuto();
     }, function() {
        carousel.startAuto();
   });
};

$(document).ready(function() {
       $('#mycarousel').jcarousel({
             initCallback: mycarousel_initCallback
        }); 
 });