$(document).ready(function() {

//// main vertical scroll
//$("#banner").scrollable({

//// basic settings
//vertical: true,
//size: 1,
//clickable: false,

//// up/down keys will always control this scrollable
//keyboard: 'static',

//// assign left/right keys to the actively viewed scrollable
//onSeek: function(event, i) {
//horizontal.scrollable(i).focus();
//}

// main navigator (thumbnail images)
//}).navigator(".navi");

// horizontal scrollables. each one is circular and has its own navigator instance
var horizontal = $(".scrollable").scrollable({ size: 1 }).circular().navigator(".navi").autoscroll(9000); ;


// when page loads setup keyboard focus on the first horzontal scrollable
horizontal.eq(0).scrollable().focus();

});