Pausing Automatic Scrolling Created Jun 4, 2009

Hello,

You can update the interval parameter dynamically. For example this call

$("div.scrollable:first").scrollable().getConf().interval = 0

will pause this page

http://flowplayer.org/tools/demos/scrollable/autoscroll.html

After updating the interval to a value, say: 1000 and mouseovering the scrollable the autoscrolling begins again. Unfortunately the mouseover is needed at this point to resume scrolling.

Thanks for the reply. If I understand correctly I cannot have a page load with automatic scrolling enabled, but disable it when the user clicks on the navigational elements for the same instance of scrollable. Is that accurate?

you can do this with jQuery. for example:

$("div.scrollable").click(function() {
  $(this).scrollable().getConf().interval = 0 
});

I am having trouble making this work. Below is my code to initialize the instance of scrollable, which otherwise works flawlessly, and the code I thought would stop automatic scrolling when the user clicks on the navigational elements.

$(document).ready(function() {

	$("#marquee_wrapper .scrollable").scrollable({
		size: 1,
		vertical: true,
		loop: true,
		interval: 10000,
		speed: 200,
		clickable: false,
		navi: '.rotator'
	});
	
	$("#marquee_wrapper .rotator a").click(function() { 
		$(this).scrollable().getConf().interval = 0;
	});

});

I'd also like to call a method to pause the automatic scrolling from outside of my instance of scrollable. For example, I'm using scrollable to create a homepage marquee slideshow and I'd like scrolling to pause while the website's global navigational menu is open and z-indexed above the marquee. It is a bit distracting if the marquee is obscured, but still scrolling beneath the menu.

Thanks again for all of your help,
Ken

change your .rotator a click event to this:

$("#marquee_wrapper .rotator a").click(function() {  
   $(".scrollable").scrollable().getConf().interval = 0; 
}); 

works if you have one scrollable on the page. if you have many you should do

$(this).parents(".scrollable").scrollable().getConf().interval = 0; 

inside the click handler.