Efek Menarik Untuk Blog

Hye2...arini Farrah buat satu lagi tutorial untuk korang....<waaa tengah rajin ni tau...heee> Kali ni pulak Farrah nak tunjuk cara bagaimana nak letak efek2 yang menarik dalam blog.... sebenarnya efek2 ni untuk menambah lagi tarikan pada blog korang tak la nampak boring sangat kan? Farrah letak macam2 efek tau...korang pilih je nak guna yang mana satu... Ok...jom kita mulakan tutorial kita....

Efek Bunga Sakura Berguguran :

• first sekali, pegi ke Dashboard korang dan click Layout then pilih Edit HTML
• masukkan kod di bawah

<script src="http://postrecent.googlecode.com/files/SakuraGugurdj.js" type="text/javascript"></script>

• kemudian tekan Save.

Efek Kelopak Bunga Berguguran :

• pegi ke Dashboard korang dan click Layout then pilih Edit HTML
• masukkan kod di bawah

<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://tutorialuntukblog.blogspot.com/2011/10/tutorial-kelopak-bunga-berguguran-di.html'}).append(a).appendTo('body')});</script>

• kemudian tekan butang Save

Efek Hujan Dalam Blog :

• step yang sama jugak...korang pergi ke Dashboard dan click Layout then pilih Edit HTML
• masukkan kod di bawah

<script type="text/javascript">
// <![CDATA[
var speed=33; // makin kecil makin laju
var drops=100; // jumlah hujan
var colour="#999"; // warna hujan
/***************************\
*   Hujan di tengah hari  *
* (c) 2011 mf2fm web-design *
*  http://www.mf2fm.com/rv  *
* tutorial By P0L5K4H4CKR3W *
\***************************/
var flks=new Array();
var flkx=new Array();
var flky=new Array();
var fldy=new Array();
var swide, shigh, boddie, ifs;
window.onload=function() { if (document.getElementById) {
  var r1, r2;
  ifs=is_fixed_supported();
  boddie=document.createElement("div");
  if (ifs) boddie.style.position="fixed";
  else boddie.style.position="absolute";
  boddie.style.top="0px";
  boddie.style.left="0px";
  document.body.appendChild(boddie);
  set_width();
  for (var i=0; i<drops; i++) {
    flks[i]=createDiv(16, 2, "transparent");
    r1=createDiv(6, 2, colour);
    r1.style.top="10px";
    r1.style.left="0px";
    flks[i].appendChild(r1);
    r2=createDiv(10, 2, colour);
    r2.style.top="0px";
    r2.style.left="0px";
    if (navigator.appName=="Microsoft Internet Explorer") r2.style.filter="alpha(opacity=25)";
    else r2.style.opacity=0.25;
    flks[i].appendChild(r2);
    flkx[i]=2*Math.floor(Math.random()*swide/2);
    flky[i]=Math.floor(Math.random()*shigh);
    fldy[i]=2+Math.floor(Math.random()*4);
    flks[i].style.left=flkx[i]+"px";
    flks[i].style.top=flky[i]+"px";
    boddie.appendChild(flks[i]);
  }
  setInterval("cats_and_dogs()", speed);
}}
function is_fixed_supported() {
  var container=document.body;
  if (document.createElement && container && container.appendChild && container.removeChild) {
    var el=document.createElement("div");
    if (!el.getBoundingClientRect) return false;
    el.innerHTML="x";
    el.style.cssText="position:fixed;top:100px;";
    container.appendChild(el);
    var originalHeight=container.style.height, originalScrollTop=container.scrollTop;
    container.style.height="3000px";
    container.scrollTop = 500;
    var elementTop=el.getBoundingClientRect().top;
    container.style.height = originalHeight;
    var isSupported=(elementTop===100);
    container.removeChild(el);
    container.scrollTop=originalScrollTop;
    return isSupported;
  }
  return false;
}
function createDiv(height, width, colour) {
  var div=document.createElement("div");
  div.style.position="absolute";
  div.style.height=height+"px";
  div.style.width=width+"px";
  div.style.overflow="hidden";
  div.style.backgroundColor=colour;
  return (div);
}
window.onresize=set_width;
function set_width() {
  if (document.documentElement && document.documentElement.clientWidth) {
    swide=document.documentElement.clientWidth;
    shigh=document.documentElement.clientHeight;
  }
  else if (typeof(self.innerHeight)=="number") {
    swide=self.innerWidth;
    shigh=self.innerHeight;
  }
  else if (document.body.clientWidth) {
    swide=document.body.clientWidth;
    shigh=document.body.clientHeight;
  }
  swide-=2;
}
window.onscroll=set_scroll;
function set_scroll() { if (!ifs) {
  var sleft, sdown;
  if (typeof(self.pageYOffset)=="number") {
    sdown=self.pageYOffset;
    sleft=self.pageXOffset;
  }
  else if (document.body.scrollTop || document.body.scrollLeft) {
    sdown=document.body.scrollTop;
    sleft=document.body.scrollLeft;
  }
  else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
    sleft=document.documentElement.scrollLeft;
    sdown=document.documentElement.scrollTop;
  }
  else {
    sdown=0;
    sleft=0;
  }
  boddie.style.top=sdown+"px";
  boddie.style.left=sleft+"px";
}}
function cats_and_dogs(c) {
  var i, x, o=0;
  for (i=0; i<drops; i++) {
    flky[i]+=fldy[i];
    if (flky[i]>=shigh-16) {
      flky[i]=-16;
      fldy[i]=2+Math.floor(Math.random()*4);
      flkx[i]=2*Math.floor(Math.random()*swide/2);
      flks[i].style.left=flkx[i]+"px";
    }
    flks[i].style.top=flky[i]+"px";
  }
}
// ]]>
</script>

• tekan butang Save

Efek Salji Dalam Blog

• pergi ke Dashboard dan click Layout then pilih Edit HTML
• masukkan kod di bawah...Farrah letakkan beberapa pilihan...korang pilih la nak letak salji colour apa...

putih

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowwhite.js"></script>

purple

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowpurple.js"></script>

hitam

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowblack.js"></script>

biru

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowblue.js"></script>

merah

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowred.js"></script>

• untuk hasil yang lebih menarik letakkan di atas header 

pesan Cik Lovely : sory ye...kali ni Farrah tak sediakan gambar...so korang test lah sendiri :)