Jika anda bosan dengan background yang itu-itu saja, ada baiknya anda membaca tips ini sampai habis. Background slide show adalah latar belakang yang bisa berganti-ganti secara otomatis setiap waktu.
Petama Background slide show ini harus di load dengan JQuery yang biasanya dipasang di atas kode </head>
KODE 1 |
<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, harus ada seperti ini
KODE 2 |
body { background: black url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1ZQT3adxU-J1D2H0GuSC__CUUh8qd68PNUidWZwMYZ_kUD-1WGLiHUeN4yl7qCSqz7cnOXae1kU7WZxkqHq4HAqvJfC6P0GiW76ejb0MCNo7o_5k6CxXDVJwx04_yUH_CO0lTG8210A/s1600/free-wallpaper-2.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 Background Slide Show dibawah ini :
<script
type='text/javascript'> var ssBG={ gbr:[
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpe7zLgabU8EMLG5JTD4BpY8NzH9wti1xrkMdz-QAZX4QxqeMUjAf4Tm3jYmWOaSAuescm6Qe35gq7Nr3gC3aYT3u48Uq3NhDYSbKj__QKI4qB-zOilR7Xr6tu2u4E5CRiSz5LklNdFw/s1600/3d-desktop-background-hd-of-art-and-design.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIDuKEYtwsqNW6XxR_nEnTZPOdpmbSWyzZjsc3DNfKhuEJYhyphenhyphenRR_plcd1qZvlX9tKivT9_1h_OVXyge48HL9ujTzWAai6bv4OjYhzkLrhFkNRQzYrRynyZLRq0iA0FzsXUj4332ris-w/s1600/3D-Background-Ball-Free-Download.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKpOFfNFUigIIZJNb8GZkRrg3iI4kVh-1sSEHh5qkQV34c2ZT0CHvI-6of3UPCD3C3GXD44-NLEc3O99qeECA4DEcWYE4mQmw9Hf1rjmolUdVgGZyHra7FVgQTiSpNewmfi6WlqZHUHg/s1600/Snow_leopards.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjh2TT9HrgyxxvSHXk3-ai3sAqRdpaDZc-mgpVZHOYgJyFqoHH6SHqXd36SM-b7giemUbiiiClEAHRLzWZ0aUlhyphenhyphenYmEhg6aXvd1HVCg0SHetb9SkSVFCKblWy00b8szWICemYSG7kXXJA/s1600/3d-hd-wallpaper-ja-amazing-wallpaper+%281%29.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLt4yqWazBB8ldr5tcrqteheLh-SjtnNvHVmlMFFoeERZXJhuwzDjEjMUECh9QxbVOEXlRzyz7N5MzMjsJ-u5rQse607zx7hqYNbzU5Sl9qH8B1s8Zynxdn0sKFTJH0tMIc-X4UxHrIg/s1600/3d-desktop-backgrounds.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhC-SkPqjzRpvkbeVLHv87A-R2KT74ZIid7ZD2nW5hcIpZ8DIiTMGooq-kMPL5-dxFIr4uszCoKSNWCtghVhuk_sV1nLHHXzzUhyRWLUotPwv9T0uWBbFdhS1DhhR7tT9bFmw3IMCHsYA/s1600/3D_desktop_wallpaper.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEsxgffBDru57wjRgTB3GMDOhzf3paYFUp_46w8KnB5w6KLYfm9uR54kUmdxJnSqcDECT70ezfPeqoZoWrCkPC8BJOqBaCO1j0nszOOXvOF6R_3eRJxIGF_k1nufSOhwmXOFKzfAjIO0g/s1600/China_Country_4+%28wallpapersbay.blogspot.com%29.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXcKh0yD4qUDP0Ap0w2GZJ_qSWyzasME7l7qmF9Wk3DP9lMKaNlaOPvvG4AAHHY8ikwWd3SMFgFHQwoAVBPJrvQi0w7dCeuoxZblHANB64PhS2-zxNkwVRSolaBycxvOCrZpRSu7DE8PU/s1600/Rainbow_Wallpapers_(1)+%28wallpapersbay.blogspot.com%29.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_8WwdfPXLGtYFgin4sncTGj-UoqMsYF88KnGdU4wFlvc9-2kTPznEbGFT9qcgMPtHfJDJ-Cv9uldIFcXEZWGhJJbyGW5YhKTTW-BFAKGlD_EuQVfh6PGvVCyDD-oodflDS_eGSJR_eOw/s1600/Creative-Digital-Animal-Wallpapers-24+%28wallpapersbay.blogspot.com%29.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEht9zR0j1BN0FJHFR-6IrkpvgPYJSshZuPpP67ePNxmgVz5qzYnoicQ17dGJ9OLMEDmPZB7QZ5q0yZoJJlSXSne9BZZuA3OB5oM4E5yGV1dODKXWNZA3b50uSQM-PqmUmrr3xk3_5Iwl0c/s1600/Thunder_Storm_Wallpapers_(37)+%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()})</script>