Demo:
Selain efek nudging, korang boleh cuba efek ni untuk tema blog ala-ala star wars ;) Caranya:
1) Sign in akaun blogger
2) Dashboard >> Design >> Page Element >> Add A Gadget >> Html / Javascript
3) Copy dan paste kod di bawah pada ruang Html / Javascript tadi:
<script type="text/javascript">Nota:
// <![CDATA[
var speed=33; // lower number for faster
var warp=3; // from 1 to 10
var stars=100; // number of stars
var colour="#66FF66"; // colour of stars
var position=0; // set to '-1' for stars to appear behind text on page
/****************************
* Star Warp Effect *
* (c) 2005 mf2fm web-design *
* http://www.mf2fm.com/rv *
* Tutorial by Polskahackrew *
****************************/
var i;
var strs=new Array();
var strx=new Array();
var stry=new Array();
var stdx=new Array();
var stdy=new Array();
var swide=800;
var shigh=600;
warp/=100;
window.onload=function() { if (document.getElementById) {
var b, s, temp;
set_width();
b=document.createElement("div");
s=b.style;
s.position="absolute";
s.zIndex=position;
b.setAttribute("id", "bod");
document.body.appendChild(b);
set_scroll();
for (i=0; i<stars; i++) {
strs[i]=document.createElement("div");
strs[i].style.backgroundColor=colour;
strs[i].style.overflow="hidden";
strs[i].style.position="absolute";
stdy[i]=Math.random()*4-2;
stdx[i]=Math.random()*6-3;
temp=Math.random()*100;
strx[i]=swide/2+temp*stdx[i];
stry[i]=shigh/2+temp*stdy[i];
if (Math.abs(stdx[i])+Math.abs(stdy[i])>2.66) {
strs[i].style.width="2px";
strs[i].style.height="2px";
}
else {
strs[i].style.width="1px";
strs[i].style.height="1px";
}
b.appendChild(strs[i]);
}
setInterval("warp_drive()", speed);
}}
function warp_drive() {
for (i=0; i<stars; i++) {
stry[i]+=stdy[i];
strx[i]+=stdx[i];
stdx[i]*=1+warp;
stdy[i]*=1+warp;
if (stry[i]>0 && stry[i]<shigh-3 && strx[i]>0 && strx[i]<swide-3) {
strs[i].style.left=Math.floor(strx[i])+"px";
strs[i].style.top=Math.floor(stry[i])+"px"
}
else {
strx[i]=swide/2;
stry[i]=shigh/2;
stry[i]+=stdy[i]=Math.random()*4-2;
strx[i]+=stdx[i]=Math.random()*6-3;
if (Math.abs(stdx[i])+Math.abs(stdy[i])>2.66) {
strs[i].style.width="2px";
strs[i].style.height="2px";
}
else {
strs[i].style.width="1px";
strs[i].style.height="1px";
}
}
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth-13;
shigh=self.innerHeight-13;
}
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-=2;
shigh-=2;
}
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>
66FF66 - warna bintang. Tukar kepada kod warna yang korang suka. Rujuk kod warna di bawah.
( untuk paparan lebih besar, klik di sini)
4) Lastly, klik save dan lihat hasilnya.
Selamat mencuba! :)
hye awak saya suka semua yg ada dalam ni tp boleh x nak tau mcm mana nak taruk gambar comel kat blog??
ReplyDeletesucces is a journey ,not is destinaton
ReplyDeletesucces is a journey ,not is destinaton
ReplyDeletecmne nak buat ygade gmbr rumh tu? yg ade tulis home tuh? ps2 yg ade ank pnh tuh...? tolong ajar kan leh tak?
ReplyDelete:D menarik sekali
ReplyDelete@★łєdчα★ rujuk tutor ni ye http://jombinabelog.blogspot.com/2011/12/tukar-newer-post-home-dan-older-post.html
ReplyDeletehehe.. i pun comel ker?? :)
ReplyDeletekalo nak hilangkan readmore, kaya mane ye??
ReplyDeleteaku kok gak bisa yg Star itu? :( tolong bantuin donk,kmu yang gituin...passnya aku kasih tau,hehehe :p kalau boleh,kalau gak sih gpp
ReplyDeletesy nk tahu mcm mn nk tambah follower?
ReplyDeleteSaya nak buat yg macam star wars tu takk bolehlah..
ReplyDeleteYang letak shoutbox pun same
Begitu juga dengan letak blog achieve dlm box
Yang lain semua berjaya..Hee :)
1.tu takk jadi sbb takk tahu la kenapa
2.&3. tu sebab saya takk tahu nak cari url yg panjang lbr tuu,,adehh..pening nk cari satu2..ari pun tak jumpa jugakk
Tapi,nak ucap thanks alot laa sebab awk sy berjaya cantikkan blog sy :)
salam..aiyppp !! jadi la..tengs ^_^
ReplyDeletenice blog ^__^ i follow....
ReplyDeletehurrmmm, sedih3 !! hari tu buat blh jew star nie,xdek bantahan pun..tetibe lak hari nie star tu tak munculkn diri dh..buat smula 4,5 kali tak jugak muncul..uhuukkkk :'(
ReplyDeleteb0ley tk t0long edit my bl0g sebab bila sy edit sndiri tk cantik lah :)
ReplyDeletePlease ...