Cara Membuat Efek Daun Berjatuhan Di Blog Blogger

Sobat, kali ini saya akan menuliskan tutorial / cara membuat efek daun berjatuhan di blog blogger.

Satu lagi hiasan blog /efek untuk blog yang bisa dijadikan sebagai hiasan blog blogger, yaitu efek daun berjatuhan untuk blog blogger dan bisa juga digunakan untuk blog lain atau website.

Hiasan blog seperti efek daun berjatuhan ini bukanlah hal yang wajib kita gunakan, namun tidak ada salahnya juga kita mengetahui bagaimana cara membuat efek daun berjatuhan di blog untuk menambah pengetahuan.

Script efek daun berjatuhan untuk blog ini dibuat oleh Altan d.o.o, dan cara menggunakannya sebenarnya juga tidak sulit kok, kita hanya perlu menyisipkan kode script efek daun berjatuhan pada blog kita, dan untuk lebih jelasnya silakan ikuti langkah - langkah yang saya tuliskan di sini.

Langkah cara membuat efek daun berjatuhan di blog blogger

Di sini saya sengaja menuliskan tutorial bagaimana cara membuat efek daun berjatuhan di blogger, yang mana tutorial ini bisa sobat jadikan sebagai gambaran jika ingin menggunakannya pada blog selain blogger, karena yang paling penting adalah script yang digunakan.

Berikut langkah - langkah cara membuat efek daun berjatuhan di blogger :

1. Masuk ke dasbor blogger
2. Buka halaman Tata Letak
3. Klik Tambahkan Gadget / Add a Gadget
4. Pilih gadget HTML/JavaScript
5. Masukkan script efek daun berjatuhan pada bagian Konten / Content
6. Simpan dan selesai

Nah itulah langkah cara membuat efek daun berjatuhan di blogger, dan adapun script efek daun yang harus sobat masukkan pada gadget HTML/JavaScript tadi adalah ini :

<script type='text/javascript'>//<![CDATA[
/******************************************
* Snow Effect Script- By Altan d.o.o. (http://www.altan.hr/snow/index.html)
* Visit Dynamic Drive DHTML code library (http://www.dynamicdrive.com/) for full source code
* Last updated Nov 9th, 05 by DD. This notice must stay intact for use
******************************************/
//Configure below to change URL path to the snow image
var snowsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5Z0iirAORrAulAVILgwb6kmAiaO1i3920s4f_FcTt-pgouWYgepoDHcPeuo3x84AqZcQHAXfFAVPy9KEsqmt4U03B21PXxTunz85LrXmXvPvFf0P2sv5pf9Wv6t49PiuOIWp_PYYGBt2r/s1600/daun.gif";
// Configure below to change number of snow to render
var no = 20;
// Configure whether snow should disappear after x seconds (0=never):
var hidesnowtime = "0";
// Configure how much snow should drop down before fading ("windowheight" or "pageheight")
var snowdistance = "pageheight";
///////////Stop Config//////////////////////////////////
   
     var ie4up = (document.all) ? 1 : 0;
     var ns6up = (document.getElementById&&!document.all) ? 1 : 0;
   
    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }
   
     var dx, xp, yp;    // coordinate and position variables
     var am, stx, sty;  // amplitude and step variables
     var i, doc_width = 800, doc_height = 400; 
     
     if (ns6up) {
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
     } else if (ie4up) {
    doc_width = iecompattest().clientWidth;
    doc_height = iecompattest().clientHeight;
     }
   
     dx = new Array();
     xp = new Array();
     yp = new Array();
     am = new Array();
     stx = new Array();
     sty = new Array();
     snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "snow.gif" : snowsrc
     for (i = 0; i < no; ++ i) {  
    dx[i] = 0;                        // set coordinate variables
    xp[i] = Math.random()*(doc_width-50);  // set position variables
    yp[i] = Math.random()*doc_height;
    am[i] = Math.random()*20;         // set amplitude variables
    stx[i] = 0.02 + Math.random()/10; // set step variables
    sty[i] = 0.7 + Math.random();     // set step variables
     if (ie4up||ns6up) {
      if (i == 0) {
     document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://www.ahmadrifai.net\"><img src="+snowsrc+" border=\"0\"><\/a><\/div>");
      } else {
     document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src="+snowsrc+" border=\"0\"><\/div>");
      }
    }
     }
   
     function snowIE_NS6() {  // IE and NS6 main animation function
    doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
     doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")?  iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
    for (i = 0; i < no; ++ i) {  // iterate for every dot
      yp[i] += sty[i];
      if (yp[i] > doc_height-50) {
     xp[i] = Math.random()*(doc_width-am[i]-30);
     yp[i] = 0;
     stx[i] = 0.02 + Math.random()/10;
     sty[i] = 0.7 + Math.random();
      }
      dx[i] += stx[i];
      document.getElementById("dot"+i).style.top=yp[i]+"px";
      document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";  
    }
    snowtimer=setTimeout("snowIE_NS6()", 10);
     }
   
    function hidesnow(){
     if (window.snowtimer) clearTimeout(snowtimer)
     for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
    }
     
   
   if (ie4up||ns6up){
    snowIE_NS6();
     if (hidesnowtime>0)
     setTimeout("hidesnow()", hidesnowtime*1000)
     }
//]]></script>

Selamat mencoba cara membuat efek daun berjatuhan di blog blogger ini dan semoga berhasil.