bgSlider.js: need to activate the slideshow
Dear all I have the following BgSlider.js script and I've been struggling to make the background images rotate automatically rather than clicking on the pagination to move from one image to the other. Tried changing some of the options like slideshow=true and also tried changing the duration speed. Here is the code I'm working with:
PHP Code:
$.extend(_fw.meth,{
bgSlider:{
slideshow:false,
duration:1500,
easing:'',
preload:false,
pagination:true,
pagActiveCl:'current',
pagEv:'click',
pagArea:'a',
current:0,
currN:0,
method:'fit',
altCSS:{},
padding:0,
preload:false,
spinner:false,
minSpinnerWait:150,
preloadFu:function(){
var opt=this,
img=$('<img>')
.css({position:'absolute',left:'-999%'})
.appendTo('body'),
num=opt.images.length
;(function(){
if(num)
img .load(arguments.callee)
.attr({src:opt.images[--num]})
else
img.remove()
})()
},
pagsFu:function(){
var opt=this,
pags=opt.pags=$(opt.pagination+' li')
if(!opt.images)
opt.images=[],
pags.each(function(i){
opt.images.push($('a',this).attr('href'))
})
pags.find(opt.pagArea).each(function(i){
$(this).data({num:i})
})
pags.parent()
.delegate(opt.pagination+':not(.'+opt.pagActiveCl+')'+(opt.pagArea?' '+opt.pagArea:''),opt.pagEv,function(){
var th=$(this)
opt.changeFu(th.data('num'))
opt.pags.not(th.parent().addClass(opt.pagActiveCl)).removeClass(opt.pagActiveCl) ;
Cufon.replace('.pagination li', { fontFamily: 'Ubuntu', hover:true });
return false
})
},
preFu:function(){
var opt=this
opt.img
.css({
position:'absolute',
left:0,
top:0
})
.css(opt.altCSS)
.attr({src:opt.images[opt.current]})
opt.img.each(function(){
var _f=function(){
opt.resizeFu()
opt.img.data({width:opt.img.width(),height:opt.img.height()})
}
if(this.complete)
_f()
else
$(this)
.load(_f)
})
opt.holder
.css({
position:'fixed',
left:0,
right:0,
top:0,
bottom:0,
zIndex:-1
})
.append(opt.img)
if(opt.spinner)
opt.spinner.hide()
},
resizeFu:function(){
var opt=this,
img=opt.img,
w=opt.wi,
h=opt.he,
l=img.css('left'),
t=img.css('top'),
bw=document.body.offsetWidth-opt.padding,
bh=document.body.offsetHeight,
k=w/h
},
changeFu:function(n){
var opt=this
if(n==opt.currN)
return false
opt.currN=n
opt.showFu(opt.images[n])
},
nextFu:function(){
var opt=this,
n=opt.currN
opt.changeFu(++n<opt.images.length?n:n=0)
opt.pags.eq(n).addClass(opt.pagActiveCl).siblings().removeClass(opt.pagActiveCl)
},
prevFu:function(){
var opt=this,
n=opt.currN
opt.changeFu(--n>=0?n:n=opt.images.length-1)
opt.pags.eq(n).addClass(opt.pagActiveCl).siblings().removeClass(opt.pagActiveCl);
Cufon.replace('.pagination li', { fontFamily: 'Ubuntu', hover:true });
},
showFu:function(src){
var opt=this,
clone=opt.clone=opt.img.clone(true)
if(opt.slideshow)
clearInterval(_timer[0])
clone
.css({
opacity:0,
left:0,
top:0
})
.appendTo(opt.holder)
.width(opt.img.width())
.load(function(){
var th=$(this)
opt.holder.find('>*').stop()
setTimeout(function(){
opt.spinner.hide()
opt.wi=th.width()
opt.he=th.height()
clone
.stop()
.animate({
opacity:1
},{
duration:opt.duration,
easing:opt.easing,
complete:function(){
var tmp=opt.holder.find('img')
opt.img=$(this)
tmp.not(tmp.last()).remove()
opt.resizeFu()
}
})
},opt.minSpinnerWait)
})
.attr({src:src})
opt.spinner.show()
if(opt.slideshow)
_timer[0]=setInterval(function(){
opt.nextFu()
},opt.slideshow)
},
init:function(opt){
var holder=opt.holder=this,
img=opt.img=$('<img>')
if(opt.pagination)
opt.pagsFu()
if(opt.spinner)
opt.spinner=$(opt.spinner)
opt.preFu()
if(opt.preload)
opt.preloadFu()
window.onresize=function(){
opt.resizeFu()
}
if(opt.slideshow)
_timer[0]=setInterval(function(){
opt.nextFu()
},opt.slideshow)
holder.data({opt:opt})
