scriptnya saja yang berbeda. Tanpa buang waktu,
berikut ini adalah caranya. Sekedar untuk mengingatkan
anda maka akan saya mulai dari tahap pertama.
1. Pada layar Dasbor, anda pilih Rancangan
2. Tambah Gadget dan pilih HTML/JavaScript
3. Script di bawah ini masukkan ke dalam kontennya.
.css1{
position:absolute;top:0px;left:0px;
width:16px;height:16px;
font-family:Arial,sans-serif;
font-size:16px;
text-align:center;
font-weight:bold;
}
.css2{
position:absolute;top:0px;left:0px;
width:10px;height:10px;
font-family:Arial,sans-serif;
font-size:10px;
text-align:center;
}
//-->syamsudinnamaku.blogspot.com
//Hide from older browsers
if (document.getElementById&&!document.layers){
// *** Clock colours
dCol='#000000'; //date colour.
fCol='#ff00ff'; //face colour.
sCol='#0000ff'; //seconds colour.
mCol='#9000ff'; //minutes colour.
hCol='#F37021'; //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("SUNDAY","MONDAY","TUESDAY","WEDNESDAY","THURSDAY","FRIDAY","SATURDAY");
theMonths=new
Array("JANUARY","FEBRUARY","MARCH","APRIL","MAY","JUNE","JULY","AUGUST","SEPTEMBER","OCTOBER","NOVEMBER","DECEMBER");
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('
'+D[i]+'
');
tmpd[i]=document.getElementById("_date"+i).style;
}
for (i=0; i < F; i++){ document.write('
'+N[i]+'
');
tmpf[i]=document.getElementById("_face"+i).style;
}
for (i=0; i < H.length; i++){ document.write('
'+H[i]+'
');
tmph[i]=document.getElementById("_hours"+i).style;
}
for (i=0; i < M.length; i++){ document.write('
'+M[i]+'
');
tmpm[i]=document.getElementById("_minutes"+i).style;
}
for (i=0; i < S.length; i++){ document.write('
'+S[i]+'
');
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;
}
//-->
4. Bila anda sesuai mengikuti langkah seperti yang saya