Mau aksesoris-aksesoris blog lainnya.., ini agak berbeda, biasanya kan efek ini langsung dengan sendirinya, tapi disini efek ini akan muncul jika mouse digerakkan.., efeknya itu seperti salju yang berjatuhan.., mau lihat seperti apa efeknya ?? klik [link] Coba gerakkan mousenya di blog tersebut.., muncul kan ??..,
Mau gak efek seperti itu ?? Ikuti cara berikut kalau mau :
Mau gak efek seperti itu ?? Ikuti cara berikut kalau mau :
- Copy kode berikut :
- Agak banyak ya ?? hehehe.., lalu copy kode diatas dikotak HTML/ Java Script di Rancangan..,
- Sudah deh.., lalu liat blog kamu, gerak-gerakan mousenya sesukamu.., efek tersebut tidak akan pernah habis.
<script>
// <![CDATA[
var colour="white";
var sparkles=100;
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="3px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="3px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";
star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}
}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {
tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
function set_scroll() {
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;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
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;
}
}
function createDiv(height, width) {
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);
}
// ]]></script>
Artikel Terkait
Langganan:
Posting Komentar (Atom)
62 komentar:
ada previewnya gak ?
http://spenzaba8c.blogspot.com/, disitu bro !
cool! thanks...^_^
@Purple : ur weLcomE !!!
bagus banget boos
tq buat tutorialnya
@hilman : thanks, bro !!
thankz.........yah ..blog.y sgat bguzz
@"ical" : thankz :)
blog'y keren banget.. yg w cari ada semua.
thanks yea...
btw cara bikin efek petir ky gitu gimana ya?
hehe.. sama2 kak ^_^
itu mah background :D
thanks banget y gan!!!!!!!!!!!11
okrek gan.. sama2 ;)
kwrenn...
I Like this Blog.. :)
hohoho.. makasih sobb !!! \m/
sama_sama sob ! ^_^
hm.. kagak sob.. maaf..
gpp.. hohoho.. ^_^
mksh.....
membuat ilmu saya bertambah
:)
Ty Gan..
@diitra : kapan2 aja dah sob ^_^
@asnen : wah.. senang juga bisa membantu :)
@funny : sama2 gan ^_^
AL KHAMDULLILLAH , mantap sekali gan, telah aku coba sukses 100% tapi bagaimana yaaa agar bintang jatuhnya diganti tulisan tulisan yang jatuh atau foto foto kecil gan?
SALAM MAKRIFATBUSINESS.NET
http;//makrifatbusiness.net
wah.. belom tau ane sob.. maaf yakk.. makasih juga :D
blog ku jadi bgus hehe..makasih ya :)
waha .. senang bisa membantu... sama^^ :D
backgroud petirnya ambil darimana? pengen tuch
nk buat mcam mana ni..
@rumah tips : kesini aja sob http://dopind.blogspot.com/2011/10/membuat-background-blog-dengan-gambar.html ^^
@nur : tinggal coppas aja sob :D
baguss ,, :D
tapi agak bingung sama 'lalu copy kode diatas dikotak HTML/ Java Script di Rancangan".., ITU MAKSUD NYA DI 'edit HTML bukan ,,?? makasihh yyee,, >,<
udah bisa2,, hehe :P
tapi ada 1 lagi,, ganti warna nya bisa gx,,??
sepp kakak ^_^
ganti var colour="white"; .. ganti tuh warnanya sob ^^
makasih infonya kak,punya blog ku udah jadi ^^
wah.. semoga betah dengan aksesoris ini ^^
trma kasih atas info nya,,, sukses,,,..
jgn lipa kunjungi blog saya juga ya
http://gigastandpicture.blogspot.com
iya sob.. samasama atas kunjungannya :)
langsung ke TKP sob :D
Wah tnks ya....bgs skali......sukses
iya sob.. samasama :D
makasih buat infonya ^_*
wokee sob.. samasama :)
mancappp....!!!!!!!!
mancaappppp jugaaa ^^b
bagus banget . bLog aku jadi cantik B)
.
thanks udah bnyk yg berhasil nih Liat http://kreasiisengmiti.blogspot.com/
ahahay pamer :D
tapi aku ada belumpaham kalau Lewat Desain gmn mksutnya kak .
ehehe.. kalo blog aku ganteng :D
samaasamaa sob.. kalo lewat desain itu harus di lirik2 terus agar terbiasa ngutak ngatiknya :-D
berasa horror waktu pertama masuk blog ini ada petirnya gitu :D
kalo edit html tuh gimana caranya
misal nih disuruh paste diatas , nah kan kalo misalnya tulisan banyak gimana ?!.
ehehe.. padahal blognya bukan horor2 :D
lho ? ya pake 'ctrl + c' trus 'ctrl + v' ._.
ini di copas semuanya apa salah saru bro?
semuanyaa dong sob ^^
Rancangan di mana ya mas bro gw bru buka blog nih
Maaf Bru buat blog jadi gk ngerti banyak
di template baru, rancangan itu sama aja layout sob :)
coba ah
silahkan dicoba ^^
bisa diganti ga sob warna'a ??
var colour="white";
ganti tulisan white dgn warna yang diinginkan :)
thanks ya Gan !! skrang gua udh bisa ^^
skli lagi mksih bnyk ~
mksh inpo nya gan ....
opsi rancangan itu dimana gan? maaf ane masih newbie
gk ngerti mksdnya dimana sih.......rancangan dimana itu
ribet bro,..rancangan/tata letak apa template,..HTML/Javascript,.
pusing pilih yg mana,..tolong di perjelas,..thanks
ada efek yg laen gk bos ?
edit tata letak, tambah gadget,,, pilih gatget HTML/JAVA SCRIPT,,, PASTE CODE DI ATAS,,, simpan....
Posting Komentar