Search code examples
jquerycaroufredsel

carouFredSel. Stop carousel when is not visible on the screen

I need to pause the carousel when it is not visible on the screen. For example: when I scroll to the bottom of the page.

But I also need to resume it when it gets visible again.

Solution

  • I'm not familiar with the plugin, but one workaround could be to use jQuery Waypoints

    The plugin can be hooked to a page element which hides the carousel on scroll, then shows on scroll up? I'm assuming you want to avoid unnecessary auto-changing when not in view as it slows content elsewhere?

    If this is of use, you'd use the following syntax:

    $('#scrolled-to-div').waypoint(function(direction)) {

    if(direction == 'down') {
      $('#carousel').hide();
    }
    else
    {
      $('#carousel').show();
    }
}

    Hope this helps :) }