Tahukah sobat dengan bintang ? ya saya yakin sobat semua
pasti pada tahu dari mulai anak-anak sampai yang tua hehe… dalam kesempatan kali ini saya akan membahas
soal kursor di blog dan bintang. sobat pasti pada ingin kan tampilan blognya keren menarik dan indah
dan sobat pun biasa melakukan perubahan-perubahan baik itu untuk template,
widget dan pernak pernik lainya pada blog termasuk tips trik blog kali ini yang
membahas cara menghias kursor dengan tampilan efek bintang jatuh.
Mungkin pembahasan ini sudah lama di bahas di banya blog tapi tak ada salahnya saya bahas kembali mengingat saya masih newbie dalam urusan ngeblog
. Ya sudah
tanpa banyak kata jika sobat tertaring ingin memasangnya silahkan ikuti
langkah-langkah berikut :
Mungkin pembahasan ini sudah lama di bahas di banya blog tapi tak ada salahnya saya bahas kembali mengingat saya masih newbie dalam urusan ngeblog
. Ya sudah
tanpa banyak kata jika sobat tertaring ingin memasangnya silahkan ikuti
langkah-langkah berikut :
1. masuk
ke akun blogger sobat pilih tab layout
2. pilih
add gadget → HTML/javascript
3. masukan
kode di bawah ini kedalam kolom HTML/javascript
tadi
<script type='text/javascript'>
// <![CDATA[
var colour="#52D8ED";
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>
Catatan : untuk tulisan yang berwarna merah di atas silahkan sobat ganti untuk menentukan warna bintangnya nanti
4. terakhir tinggal sobat simpan.
untuk melihat hasilnya silahkan sobat lihat kursor yang ada di blog sobat. semoga berhasil !
Sekian artikel kali ini semoga dapat membantu dan bermanfaat dan saya ucapkan terimakasih banyak atas kunjungannya.
untuk melihat hasilnya silahkan sobat lihat kursor yang ada di blog sobat. semoga berhasil !
Sekian artikel kali ini semoga dapat membantu dan bermanfaat dan saya ucapkan terimakasih banyak atas kunjungannya.
Categories: Tips dan trik Blog
0 komentar:
Posting Komentar
Jika ada pertanyaan, kritik dan saran atau hal-hal lainya silahkan sobat memberikan komentar untuk membantu perkembangan blog ini.
Berkomentarlah dengan kaidah dan bahasa yang baik dan pantas untuk di ucapkan :
♠ Tidak memakai bahasa kasar/kotor dan sejenisnya
♠ Tidak memberikan komentar SARA
♠ Tidak membuat komentar SPAM
♠ Tidak berkomentar menghina/melecehkan pihak-pihak tertentu
dan saya ucapkan terimakasih atas kunjungan dan komentar sobat.