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