Revision: 22202
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at January 5, 2010 16:06 by charmcitycoder
Initial Code
div id="carousel-container">
<div id="paging">
<ul>
<li><a href="#" class="current-link" id="p1">1</a> </li>
<li><a href="#" id="p2">2</a> </li>
<li><a href="#" id="p3">3</a> </li>
</ul>
</div>
<div id="horizontal_carousel">
<div class="previous_button" id="prev_button"></div>
<div class="container" id="divResults">
<ul>
<li><a href="#" class="check-link" id=""><img alt="SOMETHING" title="SOMETHING" src="/images/something.jpg"/></a></li>
<li><a href="#" class="check-link" id=""><img alt="SOMETHING" title="SOMETHING" src="/images/something.jpg"/></a></li>
<li><a href="#" class="check-link" id=""><img alt="SOMETHING" title="SOMETHING" src="/images/something.jpg"/></a></li>
<li><a href="#" class="check-link" id=""><img alt="SOMETHING" title="SOMETHING" src="/images/something.jpg"/></a></li>
</ul>
</div>
<div class="next_button" id="next_button"></div>
</div>
</div>
// Javascript (called from an external file)
jQuery(function( $ ){
var $nav = $('#paging li a');
$('#carousel-container').serialScroll({
target:'#divResults',
items:'li',
prev:'div.previous_button',
next:'div.next_button',
axis:'xy',
duration:700,
force:true,
exclude:3,
step:4,
jump:false,
navigation:$nav,
onBefore:function( e, elem, $pane, $items, pos ){
$nav.removeClass('current-link');
$nav.eq(pos).addClass('current-link');
e.preventDefault();
if( this.blur )
this.blur();
}
}); //end serial scroll init
}
)
Initial URL
Initial Description
Pared down example... Using serialScroll 1.2.2, scrollTo 1.4.2
Initial Title
jquery scrollto sample code
Initial Tags
Initial Language
HTML