25/10/11

Tutorial cara buat efek ular henfon nokia pada blog


Efek ni memang lucu..anda lihat la sendiri...lalalala..teringat zaman2 penggunaan henfon 3310..game ni memang top..hahaha...taoi sekarang tinggal kenangan..

cara pasang efek ni macam biasa la....desbot---desaign---ada gadget---html / javascript..copy code di bawah kemudian paste dan save..selesai


<script type="text/javascript">
// <![CDATA[
var colours=new Array("#ffffff", "#f7eeff", "#eeddff", "#e6ccff", "#ddbbff", "#d5aaff", "#cc99ff"); // select colours to fade from wanted colour to background colour
var border="#9933ff"; // colour of border
var speed=80; // no 80 adalah kelajuan..makin kecil no makin laju
var size=20; // saiz ular nokia

/***************************\
* Block Worm Graphic Effect *
*(c)2005-6 mf2fm web-design *
*  http://www.mf2fm.com/rv  *
* tutorial by Polskahackrew*
\***************************/
var swide, shigh;
var blox=new Array();
var t, l, dt, dl;
window.onload=function() { if (document.getElementById) {
  set_width();
  var i, d, s, b;
  b=document.createElement("div");
  s=b.style;
  s.position="absolute";
  b.setAttribute("id", "bod");
  document.body.appendChild(b);
  set_scroll();
  for (i=0; i<20; i++) {
    d=document.createElement("div");
    s=d.style;
    s.width=size+"px";
    s.height=size+"px";
    s.overflow="hidden";
    s.position="absolute";
    s.visibility="hidden";
    s.border="1px solid "+border;
    d.setAttribute("id", "block"+i);
    b.appendChild(d);
    blox[i]=-1;
  }
  size+=4;
  t=4+size*Math.floor(shigh/(size*2));
  l=4+size*Math.floor(shigh/(size*2));
  set_dir();
  mainblock(0);
}}

function set_dir() {
  dt=-size+size*Math.floor(3*Math.random());
  dl=(dt)?-size+size*Math.floor(3*Math.random()):(Math.random()<0.5)?size:-size;
}

function mainblock(r) {
  do { if (Math.random()<0.2) set_dir(); }
  while (t+dt>shigh || t+dt<0 || l+dl>swide || l+dl<0);
  var s=document.getElementById("block"+r).style;
  s.left=(l+=dl)+"px";
  s.top=(t+=dt)+"px";
  blox[r]=colours.length;
  subblock(r);
  setTimeout("mainblock("+(++r%20)+")", speed);
}

function subblock(r) {
  var s=document.getElementById("block"+r).style;
  if (--blox[r]>-1) {
    s.visibility="visible";
    s.backgroundColor=colours[blox[r]];
    setTimeout("subblock("+r+")", speed*2.2);
  }
  else s.visibility="hidden";
}

window.onresize=set_width;
function set_width() {
  if (typeof(self.innerWidth)=="number") {
    swide=self.innerWidth-10;
    shigh=self.innerHeight-10;
  }
  else if (document.documentElement && document.documentElement.clientWidth) {
    swide=document.documentElement.clientWidth;
    shigh=document.documentElement.clientHeight;
  }
  else if (document.body.clientWidth) {
    swide=document.body.clientWidth;
    shigh=document.body.clientHeight;
  }
  else {
    swide=800;
    shigh=600;
  }
  swide-=15;
  shigh-=15;
}

window.onscroll=set_scroll;
function set_scroll() {
  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;
  }
  var s=document.getElementById("bod").style;
  s.top=sdown+"px";
  s.left=sleft+"px";
}
// ]]>
</script>



untuk tukar warna ular...tukar code warna tulisan merah dan kuning tu..sekian

Tiada ulasan:

entri ja

Related Posts Plugin for WordPress, Blogger...