There are 2 sliders on the page:

<script type=\"text/javascript\"> function mycarousel_initCallback(carousel) { // Disable autoscrolling if the user clicks the prev or next button. carousel.buttonNext.bind('click', function() { carousel.startAuto(0); }); carousel.buttonPrev.bind('click', function() { carousel.startAuto(0); }); // Pause autoscrolling if the user moves with the cursor over the clip. carousel.clip.hover(function() { carousel.stopAuto(); }, function() { carousel.startAuto(); }); }; <!-- Первый слайдер --> jQuery(document).ready(function() { jQuery('#mycarousel_1').jcarousel({ auto: 2, wrap: \"circular\", scroll: 1, visible: 4, start: 1, animation: 2000, initCallback: mycarousel_initCallback, itemFallbackDimension: 100 }); <!-- Второй слайдер --> jQuery('#mycarousel_2').jcarousel({ auto: 2, wrap: \"circular\", scroll: 1, visible: 4, start: 3, animation: 2000, initCallback: mycarousel_initCallback, itemFallbackDimension: 100 }); });

Both sliders load items from the same section, so that the sliders are not the same, they are written for

  • for the first start: 1
  • for the second start: 3

But the slider can work in different ways: sometimes both move at the same time, as it should. But sometimes the first one moves, the second one stands still, or vice versa. Or they begin to move, but after a while one of them stops, and the second continues to move. What is the reason and how to fix it? Tested in Google Chrome.

    1 answer 1

    With roundabouts everything is OK.

    Pay attention to the comment:

    // Pause autoscrolling if the user moves with the cursor over the clip

    Stops autoscrolling if the user hovers the mouse over the carousel slide.

    When you load a page, spend it with a mouse, so they begin to move in different ways.

    As a result, the code:

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

    delete or comment and everything will be ok.

    • Yes, I did not realize) Thank you) - Heidel