Background Slide Show adalah gambar latar belakang yang bisa
berganti-ganti secara otomatis setiap waktu yang telah ditentukan.
Background ini disematkan di bagian body dengan posisi 100%.
Background Slide Show ini pertama-tama harus di load dengan JQuery yang biasanya dipasang di atas </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js' type='text/javascript'></script> <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js' type='text/javascript'></script>
Setelah itu dibagian CSS body, minimal harus ada seperti ini:
body {
background: black url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjR9_E-njVe4V5SUA-10yXCBS9d9tQrLD3YzVC_sf83Xz8fj_8lEs3jevKi82FV4aVa9i3FNT1tiP1uEg3m5esLgkhqLCtJLoVAShLma8L_znVeowuWQTeAKPv1HAdErVe3Gn1Wg03JS3A/s320/body-santa.jpg) repeat-x fixed top center;
-moz-background-size:100%;
-webkit-background-size:100%;
-o-background-size:100%;
background-size:100%;
}
Jika sudah terpasang juga, kita harus menambah JavaScript Backround Slide Show di bawah ini:
<script type='text/javascript'>
var ssBG={
gbr:[
"http://2.bp.blogspot.com/-jXDDlst7GMc/T1SDEQ72L6I/AAAAAAAAMKc/7C4dD51XSNY/s1600/Windows-8-HD-Wallpapers+%281%29.png",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizxaH_BIH5AWj7AuciHrTvuJkiH7YmQ_ZeIY4OR4dJsQlPRmwoThPN9g3mtUH8G1SxxsTiYNHtH6yaW7YUM3UdhJdWrdf4VMaV7A1oHI-fjNdkqbNzdeGkhsGbaeGeGnXIUfkDfLs/s1600/Windows+8+xTreme+Edition.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZ_SMt5JAUsl4EVpMfrmfQhxbtMoK4k3n2C3IozEtMmAMUHGDxag99LLrYXCQZzLlXlULNEqfkXyCCt5FqzpIxGZ5gswKjwBMbpaG2ka5AsgAR_xQ3QvfJ4GOcJNAZeayEIZROIMeWxaE/s1600/Windows_8_wallpapers_3.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHpv5gHJecnmrQ0hahFvUUrsUskxLs-YEIUX7bf2Pxc8cxBZjhPm5DoHucCHfF0q18MSDaXY2nej-j1zQlO3ZKThHeBfLdh5NYbYuSkOXsCYvInX2H0Ooa5tB5_QB5GujdWeFTCE8Mq8Y/s1600/windows8professional.jpg",
"http://www.smartearningmethods.com/wp-content/uploads/2012/03/Scenic-Windows-8-9.jpg",
"http://img225.imageshack.us/img225/4564/39003694.jpg",
"http://www.deviantart.com/download/243901871/windows_8_3d_by_faisalharoon-d417nvz.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiHgatXFw6jg7Bbcx5fmsp0arSUn7yGq3Ci_zIB745TW9Zp7w8dOUaRFBxIZl5HpCDMp9waoXP3qFlt1qFD2EDMKsyeH880MfK_hb13mcE17U65K2LgFkRtBxx-NWiKiz2ctqSwFcq6is/s1600/China_Country_4+%28wallpapersbay.blogspot.com%29.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRMB0eBTAFaJ94y9Iw3ux02vcAWHv_6Axa6NzVdbM1pSIUi_Lq_tA7zuWIs78oAnq-IcbrM7ESYvjO21-XIH79QWDufriAGEfkEc50CctzWp-GQOle_0cOnOmJL1CtuHl-7n0hygDJVKU/s1600/Rainbow_Wallpapers_(1)+%28wallpapersbay.blogspot.com%29.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNS03zNNFH63v7YNRxshSwiOwoWGY0IMTQ8jahUpjxaqOAGpJ5YL5RFddUqerq3UstiVuoSQ1b2ARe9zjcdPFVlZXJvMSrZHbIw_gPDwl7qGxTTQFJRF4LwFcFJW1QW9dt5b2u4MIx_Y0/s1600/Creative-Digital-Animal-Wallpapers-24+%28wallpapersbay.blogspot.com%29.jpg",
"1.bp.blogspot.com/_KjKudOQDFIw/TIBQjNvqJHI/AAAAAAAADRo/g_FBWqwMKAw/s1600/Thunder_Storm_Wallpapers_%2837%29+%28wallpapersbay.blogspot.com%29.jpg"
],
now:0,
SlideMyBG:function(list,style,speed,bgPos,bgSize,bgRep){
if(!ssBG.SlideMyBG.hasRun){ssBG.SlideMyBG.hasRun=true;
if(list==null||list==''){list=ssBG.gbr}else{if(typeof list!='object'){list=ssBG.gbr}}
if(style==null||style==''){style='random'}
if(speed==null||speed==''){speed=5000}
if(bgPos==null||bgPos==''){bgPos='top center'}
if(bgSize==null||bgSize==''){bgSize='100%'}
if(bgRep==null||bgRep==''){bgRep='repeat'}
ssBG.gaya=style;ssBG.jeda=speed;ssBG.gbr=list;ssBG.pos=bgPos;ssBG.size=bgSize;ssBG.rep=bgRep;
ssBG.opt={'background-attachment':'fixed','background-repeat':ssBG.rep,'-moz-background-size':ssBG.size,'background-size':ssBG.size};
}
if(ssBG.gaya=='random'){ssBG.gbr=ssBG.gbr.sort(function(){return 0.5-Math.random()})}
var img=new Image();var brp=ssBG.gbr.length;if(ssBG.now>=brp){ssBG.now=0}
var gbrSkrng=ssBG.gbr[ssBG.now];ssBG.now++;
if($('#bg-fader').length==0){$('body').prepend('<div id="bg-fader" style="opacity:0.0;top:0;left:0;width:100%;height:100%;background-color:'+$('body').css('background-color')+'"></div>');$('#bg-fader').css(ssBG.opt);$('body').css(ssBG.opt)}
$(img).load(function(){
$('#bg-fader').css({'background-image':'url('+gbrSkrng+')','background-position':ssBG.pos}).animate({opacity:1.0},'slow','linear',function(){
$('body').css({'background-image':'url('+gbrSkrng+')','background-position':ssBG.pos});
$(this).animate({opacity:0.0},'slow','linear');
setTimeout("ssBG.SlideMyBG()",ssBG.jeda);
});
}).attr('src',gbrSkrng).error(function(huh){ssBG.SlideMyBG()});
}
};
</script>
<script type='text/javascript'>$(window).load(function(){ssBG.SlideMyBG
