I'm using two Cycle slideshows with a single pager and different effects on each slideshow (with the metadata plugin).
I would also like to animate the first slide of each slideshow as documented here, but I'm having trouble with the syntax.
This is my current js
$(document).ready(function() {
$('.slideshow').each(function(index) {
$(this).cycle({
pager: '#pager',
pagerAnchorBuilder: function(i) {
if (index == 0)
// for first slideshow, return a new anchro
return '<a href="#">'+(i+1)+'</a>';
// for 2nd slideshow, select the anchor created previously
return '#pager a:eq('+i+')';
}
});
});
});
The effects are coded on the .slideshow divs (with the metadata plugin)
<div class="slideshow { fx: 'scrollRight', timeout: 0, cleartypeNoBg: true, speed: 750, easing: 'easeInOutBack' }">
<div class="slideshow { fx: 'scrollLeft', timeout: 0, cleartypeNoBg: true, speed: 750, easing: 'easeInOutBack' }">