Hay friends, Dengerin lagu yuks
Hehehehe ..
Hay friends, I Santa Mars
Nama asli ane Marsyanta
Welcome to my blog
I am Indonesian people
aye Ingin sekali jadi orang terkenal :D
Hopefully all useful
Thank you .




Navbar Bawah

Membuat Background Slide Show

 
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/AVvXsEjStRvsl2Rhm1psCQ7yoPOC7D1MmTSQyvJxI6Cyjtfjb_k4FMp_tu4339sBZ_eIlN6hoF9XrNBvD3Uq9pRhzwlxYn4q6ixPCWvsMsGuSJ9LH3N8hBExEOUl48OVQpYRWs0rQ81dt2wWU6g/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/AVvXsEjgKGvTbr5NL2J3q3hoOxLOzbjqvnr0oZiynBDdcf9OyA_3vdrXzCc3XWTRNDN2qNOjT-oMgzQF2fh66xqFEXrZ_Uy7hUGsmSAQdy2RmMPkXkCc2tdz0iMTQCdPkTRHhEvxRRqW664/s1600/Windows+8+xTreme+Edition.jpg",
    "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJ5gR7N6lXNjLbYCy-JRJ4MZfeBq8CU2NmPJPuwQ3eLVwIW3Fpr8shaaVWUdEY85G1qZxqdrGx7G5JfHcoIPhubOlrUyMKrkh9QYT1PSMCDs5eBvr0iyyoTthV1Q1yzus3oxM1wSh7_Fc/s1600/Windows_8_wallpapers_3.jpg",
    "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUjluvfvfXnHJuCj7pWtPwGI2MmLcNW0GKwpNxp0a94jlGq5pg4BgR3LxZY3nvcD9IdoeNG1Z2Qo-ChcHZI0-5yyXPQVi7O2sFAKd96S0-20VN9uZb8h3PMcALtqoEkHbLlaCCB0AkHVM/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/AVvXsEjaEw9u_sNhQb9FagOKRd6TjDO2rXdqAKZXrRHDaQEeVIN8Ci52L3xMIiDt3rpV9T9WlzQuy1RgOJnguHTc6V2hUa2RV_q4hjqD78Tf2B-wOuBvo0vOsDfQLdmWAb0dazeUGfma9nKEo9Q/s1600/China_Country_4+%28wallpapersbay.blogspot.com%29.jpg",
    "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCURqZm79modwB3EPrJyJC2rzL7FqjZxdqzB100t0oCRpaGEo9bImO-XcMHlOcE1rV7oAJbDN3glLWH3UsEWDr2_HYAY85_lGhh5V-J3SnHWtflLVDqRFqVL-xvkbVImypJzSpRqrP3F4/s1600/Rainbow_Wallpapers_(1)+%28wallpapersbay.blogspot.com%29.jpg",
    "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtSg3rRtl8-rUPTHFyrZhJjQU1skbDn45NcwbQFkiRMF5v5iMEw2LQOVZFkpdVguuqn-iLTG1ciVu5N48F3Ssp0sLiIkx0216OPDCb4g81MPafT2TPikm85_P__fYz2VxNSRsk5OH7IJ4/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()})</script>