[jQuery] stop animating jquery-serialscroller by onmouseover
Hi everyone!
As i am new here, i'm wondering if this is the right place to post my
question about interactive control of serialScroll. I am trying to
describe my problem, any help or hint is greatly appreciated!
I am using jquery (jquery.js), jquery-scrollto (jquery.scrollTo-1.3.3-
min.js.js) and jquery-serialscroller (jquery.serialScroll-1.2.1-
min.js) on a website. There are four slide-divs i am serialscrolling.
This works fine and looks smooth.
Here is the code for initialization:
$(document).ready(function(){
$('#slider').serialScroll({
target:'div.slide-viewport',
items:'div.slide', //selector to the items ( relative to the matched
elements, '#sections' in this case )
prev:'img.prev',//selector to the 'prev' button (absolute!, meaning
it's relative to the document)
next:'img.next',//selector to the 'next' button (absolute too)
axis:'x',//the default is 'y'
queue:false,//we scroll on both axes, scroll both at the same time.
event:'click',//on which event to react (click is the default, you
probably won't need to specify it)
stop:false,//each click will stop any previous animations of the
target. (false by default)
lock:true, //ignore events if already animating (true by default)
duration:1500,//length of the animation (if you scroll 2 axes and
use queue, then each axis take half this time)
start: 0, //on which element (index) to begin ( 0 is the default,
redundant in this case )
force:true, //force a scroll to the element specified by
'start' (some browsers don't reset on refreshes)
cycle:true,//cycle endlessly ( constant velocity, true is the
default )
step:1, //how many items to scroll each time ( 1 is the default, no
need to specify )
jump:false, //if true, items become clickable (or w/e 'event' is,
and when activated, the pane scrolls to them)
lazy:false,//(default) if true, the plugin looks for the items on
each event(allows AJAX or JS content, or reordering)
interval:5000, //it's the number of milliseconds to automatically go
to the next
constant:false
});
});
No i need to stop the automatic serialScroll-animation on mouseover.
The customer wants to move the mouse onto the slide-area when the
content is interesting.
I tried something like
<div id="slider" class="main_content slider" onmouseover="$
('#slider').serialScroll.stop(true);">
<here come the slide divs>slide contents</here come the slide divs>
</div>
Has anyone experience with this? Is it possible to stop serialScroll-
animation from inside a mouseover-event?
Thanks for any help or hint into the right direction
QuadBlade