Sabtu, 02 Februari 2013

Cara Membuat Bunga Berguguran Atau Bertaburan Di Blog




Blog yang memiliki tampilan indah akan membuat pengunjung merasa senang dalam menjelajahi semua konten dari blog kita yang mereka baca. Keindahan atau pesona yang ditampilkan blog kita, tidak menutup kemungkinan akan memancing mereka untuk datang kembali ke Blog kita. Apa yang harus sobat blogger lakukan untuk memperindah tampilan blog sobat? Salah satu cara yang bisa dilakukan untuk memperindah blog adalah dengan memasang efek bunga berguguran di blog.

Efek bunga berguguran di blog ini, menampilkan kelopak bunga warna pink dan merah yang berjatuhan atau berguguran secara bergiliran. Fitur ini di buat dengan menggunakan jQuery oleh situs jquery.com. Untuk menambahkan fitur bunga berguguran di blog, sobat blogger tidak perlu edit template atau edit kode. Bagaimana caranya? Ikuti saja Tutorial Blogspot dibawah ini.
  • Sign In di blogger.com
  • Pada menu drop down, pilih Layout
  • Klik Add a gadget dan pilih HTML/JavaScript
  • Copy Paste kode di bawah ini pada kolom yang tersedia

<script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>if(!image_urls){var image_urls=Array()}if(!flash_urls){var flash_urls=Array()}image_urls['rain1']="http://2.bp.blogspot.com/-IQXNv-_CBLE/TpWcK7LL4VI/AAAAAAAAG0I/bcxYcqc_uI0/pinkpetal1.png";image_urls['rain2']="http://4.bp.blogspot.com/-teXCIicWPF4/TpWcLLg0A2I/AAAAAAAAG0U/IPPCr1gponc/pinkpetal2.png";image_urls['rain3']="http://3.bp.blogspot.com/-3JG9HLECCRU/TpWcLZGSYtI/AAAAAAAAG0g/zIJINua93TE/redpetal1.png";image_urls['rain4']="http://2.bp.blogspot.com/-BByhQEK5E24/TpWcLux4xRI/AAAAAAAAG0s/x2hIr1AV_Ac/redpetal2.png";$(document).ready(function(){var c=$(window).width();var d=$(window).height();var e=function(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a){setTimeout(function(){a.css({left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e(7500,8000),function(){$(this).fadeOut('slow',function(){f(a)})})},e(1,8000))};$('<div></div>').attr('id','rainDiv')
.css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-5px',display:'block'}).appendTo('body');for(var i=1;i<=20;i++){var g=$('<img/>').attr('src',image_urls['rain'+e(1,4)])
.css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100),'margin-left':0}).addClass('rainDrop').appendTo('#rainDiv');f(g);g=null};var h=0;var j=0;$(window).resize(function(){c=$(window).width();d=$(window).height()})});</script>
<script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>$(document).ready(function(){var a=$('<img>').attr({'src':'http://2.bp.blogspot.com/-IQXNv-_CBLE/TpWcK7LL4VI/AAAAAAAAG0I/bcxYcqc_uI0/pinkpetal1.png','border':0});$('<a></a>').css({position:'absolute',right:'0px',top:'22px','z-index':'90'}).attr({'href':'http://indosoftgame.blogspot.com/'}).append(a).appendTo('body')});</script>
  • Simpan Widget sobat.Refresh atau reload blog sobat blogger untuk melihat hasilnya. 

Bingung cara untuk mendownload ???


Silahkan Klik Disini



0 komentar