You are here: » Home » java » MakelarSapi Blog's | Clock following Cursor

MakelarSapi Blog's | Clock following Cursor

18.59 Unknown

Rasanya tak salah kalau pasang jam yang setia mengikuti cursor . selain itu juga bisa di pakai sebagai alternatif percantik blog. ok langsung saja :

1.Paste kan kode di bawah ini sebelum kode

<style type="text/css"> 
   
  </style> 
 
  <script language="JavaScript"> 
  if (document.getElementById&&!document.layers){  
  //Clock colours 
  dCol='#ff0000';//date colour. 
  fCol='#00FF00';//face colour. 
  sCol='#0000ff';//seconds colour. 
  mCol='#00ff00';//minutes colour. 
  hCol='#ff0000';//hours colour.  
  //Controls 
  del=0.6;  //Follow mouse speed. 
  ref=40;   //Run speed (timeout).  
  //Alter nothing below! Alignments will be lost! 
  var ieType=(typeof window.innerWidth != 'number'); 
  var docComp=(document.compatMode); 
  var docMod=(docComp && docComp.indexOf("CSS") != -1); 
  var ieRef=(ieType && docMod) 
  ?document.documentElement:document.body; 
  theDays=new Array("MINGGU","SENIN","SELASA","RABU","KAMIS","JUM'AT","SABTU"); 
  theMonths=new Array("JANUARY","FEBRUARY","MARET","APRIL","MEI","JUNI","JULY","AGUSTUS","SEPTEMBER","OKTOBER","NOVEMBER","DESEMBER"); 
  date=new Date(); 
  day=date.getDate(); 
  year=date.getYear(); 
  if (year < 2000) year=year+1900;  
  tmpdate=" "+theDays[date.getDay()]+" "+day+" "+theMonths[date.getMonth()]+" "+year; 
  D=tmpdate.split(""); 
  N='3 4 5 6 7 8 9 10 11 12 1 2'; 
  N=N.split(" "); 
  F=N.length; 
  H='...'; 
  H=H.split(""); 
  M='....'; 
  M=M.split(""); 
  S='.....'; 
  S=S.split(""); 
  siz=40; 
  eqf=360/F; 
  eqd=360/D.length; 
  han=siz/5.5; 
  ofy=-7; 
  ofx=-3; 
  ofst=70; 
  tmr=null; 
  vis=true; 
  mouseY=0; 
  mouseX=0; 
  dy=new Array(); 
  dx=new Array(); 
  zy=new Array(); 
  zx=new Array(); 
  tmps=new Array(); 
  tmpm=new Array();  
  tmph=new Array(); 
  tmpf=new Array();  
  tmpd=new Array(); 
  var sum=parseInt(D.length+F+H.length+M.length+S.length)+1; 
  for (i=0; i < sum; i++){ 
  dy[i]=0; 
  dx[i]=0; 
  zy[i]=0; 
  zx[i]=0; 
  }  
  algn=new Array(); 
  for (i=0; i < D.length; i++){ 
  algn[i]=(parseInt(D[i]) || D[i]==0)?10:9; 
  document.write('<div id="_date'+i+'" class="css2" style="font-size:'+algn[i]+'px;color:'+dCol+'">'+D[i]+'<\/div>'); 
  tmpd[i]=document.getElementById("_date"+i).style; 
  } 
  for (i=0; i < F; i++){ 
  document.write('<div id="_face'+i+'" class="css2" style="color:'+fCol+'">'+N[i]+'<\/div>'); 
  tmpf[i]=document.getElementById("_face"+i).style;  
  } 
  for (i=0; i < H.length; i++){ 
  document.write('<div id="_hours'+i+'" class="css1" style="color:'+hCol+'">'+H[i]+'<\/div>'); 
  tmph[i]=document.getElementById("_hours"+i).style; 
  } 
  for (i=0; i < M.length; i++){ 
  document.write('<div id="_minutes'+i+'" class="css1" style="color:'+mCol+'">'+M[i]+'<\/div>'); 
  tmpm[i]=document.getElementById("_minutes"+i).style;  
  } 
  for (i=0; i < S.length; i++){ 
  document.write('<div id="_seconds'+i+'" class="css1" style="color:'+sCol+'">'+S[i]+'<\/div>'); 
  tmps[i]=document.getElementById("_seconds"+i).style;  
  }  
  function onoff(){ 
  if (vis){  
  vis=false; 
  document.getElementById("control").value="Clock On"; 
  } 
  else{  
  vis=true; 
  document.getElementById("control").value="Clock Off"; 
  Delay(); 
  } 
  kill(); 
  }  
  function kill(){ 
  if (vis)  
  document.onmousemove=mouse; 
  else  
  document.onmousemove=null; 
  }   
  function mouse(e){ 
  var msy = (!ieType)?window.pageYOffset:0; 
  if (!e) e = window.event;  
  if (typeof e.pageY == 'number'){ 
  mouseY = e.pageY + ofst - msy; 
  mouseX = e.pageX + ofst; 
  } 
  else{ 
  mouseY = e.clientY + ofst - msy; 
  mouseX = e.clientX + ofst; 
  } 
  if (!vis) kill(); 
  } 
  document.onmousemove=mouse;  
  function winDims(){ 
  winH=(ieType)?ieRef.clientHeight:window.innerHeight;  
  winW=(ieType)?ieRef.clientWidth:window.innerWidth; 
  } 
  winDims(); 
  window.onresize=new Function("winDims()");  
  function ClockAndAssign(){ 
  time = new Date(); 
  secs = time.getSeconds(); 
  sec = Math.PI * (secs-15) / 30; 
  mins = time.getMinutes(); 
  min = Math.PI * (mins-15) / 30; 
  hrs = time.getHours(); 
  hr = Math.PI * (hrs-3) / 6 + Math.PI * parseInt(time.getMinutes()) / 360;  
  for (i=0; i < S.length; i++){ 
  tmps[i].top=dy[D.length+F+H.length+M.length+i]+ofy+(i*han)*Math.sin(sec)+scrollY+"px"; 
  tmps[i].left=dx[D.length+F+H.length+M.length+i]+ofx+(i*han)*Math.cos(sec)+"px"; 
  } 
  for (i=0; i < M.length; i++){ 
  tmpm[i].top=dy[D.length+F+H.length+i]+ofy+(i*han)*Math.sin(min)+scrollY+"px"; 
  tmpm[i].left=dx[D.length+F+H.length+i]+ofx+(i*han)*Math.cos(min)+"px"; 
  } 
  for (i=0; i < H.length; i++){ 
  tmph[i].top=dy[D.length+F+i]+ofy+(i*han)*Math.sin(hr)+scrollY+"px"; 
  tmph[i].left=dx[D.length+F+i]+ofx+(i*han)*Math.cos(hr)+"px"; 
  } 
  for (i=0; i < F; i++){ 
  tmpf[i].top=dy[D.length+i]+siz*Math.sin(i*eqf*Math.PI/180)+scrollY+"px"; 
  tmpf[i].left=dx[D.length+i]+siz*Math.cos(i*eqf*Math.PI/180)+"px"; 
  } 
  for (i=0; i < D.length; i++){ 
  tmpd[i].top=dy[i]+siz*1.5*Math.sin(-sec+i*eqd*Math.PI/180)+scrollY+"px"; 
  tmpd[i].left=dx[i]+siz*1.5*Math.cos(-sec+i*eqd*Math.PI/180)+"px"; 
  } 
  if (!vis)clearTimeout(tmr); 
  }  
  buffW=(ieType)?80:90; 
  function Delay(){ 
  scrollY=(ieType)?ieRef.scrollTop:window.pageYOffset; 
  if (!vis){ 
  dy[0]=-100; 
  dx[0]=-100; 
  } 
  else{ 
  zy[0]=Math.round(dy[0]+=((mouseY)-dy[0])*del); 
  zx[0]=Math.round(dx[0]+=((mouseX)-dx[0])*del); 
  } 
  for (i=1; i < sum; i++){ 
  if (!vis){ 
  dy[i]=-100; 
  dx[i]=-100; 
  } 
  else{ 
  zy[i]=Math.round(dy[i]+=(zy[i-1]-dy[i])*del); 
  zx[i]=Math.round(dx[i]+=(zx[i-1]-dx[i])*del); 
  } 
  if (dy[i-1] >= winH-80) dy[i-1]=winH-80; 
  if (dx[i-1] >= winW-buffW) dx[i-1]=winW-buffW; 
  }  
  tmr=setTimeout('Delay()',ref); 
  ClockAndAssign(); 
  } 
  window.onload=Delay; 
  } 
  //--> 
  </script>

2.untuk tombol on/off paste kan kode di bawah ini sesudah kode atau di widget

Ok Selesai tinggal Save

S

E

L

A

S

A

2

9

A

P

R

I

L

2

0

2

5

3

4

5

6

7

8

9

10

11

12

1

2

.

.

.

.

.

.

.

.

.

.

.

.

Label: blog, CSS, java

Responses

0 Respones to "MakelarSapi Blog's | Clock following Cursor"

Posting Komentar

kritik, komentar, dan saran anda akan membangun blog ini menjadi lebih baik

Langganan: Posting Komentar (Atom)

Copyright © 2012 | Converted into Blogger Template by Hack Tutors | Reconstruction by Satriyanto