Simulate an infinite slideshow
Simulate an asynchrone loading
$(function(){ $('.slideshow').jocodeSlideshow({ selector : '> .scroller > div > div', //define manually the container to support, on hover event, the loader element hover_container : '.loader,.scroller', bt_first : '.first', bt_previous : '.previous', bt_play : '.play', bt_pause : '.pause', bt_resume : '.resume', bt_stop : '.stop', bt_next: '.next', bt_last : '.last', disabled_bt_class : 'disabled', auto_play : true, delay : 1000, start_index : 0, fx : new $.JocodeFxSlideshow.HorizontalScroll({ duration : 1000 }), navigation : new $.JocodeNavigationSlideshow({ selector : '> .navigation > div > .scroller > div > a', selected_class : 'selected', scrolled_class : 'scrolled', bt_next: '.scroll_next', bt_previous : '.scroll_previous', bt_first: '.scroll_first', bt_last : '.scroll_last', fx : new $.JocodeFxNavigationSlideshow.HorizontalScroll({ scroll_over : true }) }), //simulate an loader... load : function(){ var self = this, index = this.loading_index; $('.loader', this.context).show(); setTimeout(function(){ if(!self.isCanceled(index)) self.draw(); }, 1000); }, beforeDraw : function(){ //console.log('beforeDraw'); $('.loader', this.context).hide(); }, onCancel : function(canceled_index){ console.log('onCancel'); }, onPlay : function(){ console.log('onPlay'); }, onPause : function(){ console.log('onPause'); }, onResume : function(){ console.log('onResume'); }, onStop : function(){ console.log('onStop'); }, //simulate an infinite slideshow onChange : function(new_index){ console.log('onChange'); var self, i, div, a; if(!this.hasNext()){ this.pause(); self = this; setTimeout(function(){ for(i = 0; i < 10; i++){ div = document.createElement('div'); div.innerHTML = ""; self.container[0].appendChild(div); a = document.createElement('a'); a.href = '#'; a.innerHTML = "Nav1"; self.navigation.container[0].appendChild(a); } self.initPile(); self.resume(); }, 1500); } }, beforeWait : function(delay, elapsed, start_time){ console.log('beforeWait'); } }); });