Cara Menambahkan Effect Cursor Mouse Salju Di Blog

Cara Menambahkan Effect Cursor Mouse di Blog. Pernahkah teman melihat ada blog yang mempunyai effect pointer mouse yang kalau di gerakan akan muncul salju???



Kali ini admin akan coba memperlihatkan sedikt tutorial ihwal cara menciptakan effect salju pada corsur mouse di blog.

Sebelum masuk ke tutorial saya ingin mengingatkan bahwa dikala teman menambah banyak effect pada tampilan blog hal tersebut akan mempengaruhi loading blog sobat, tapi kalau teman ingin menciptakan tampilan blog teman kelihatan keren dan menarik apa salahnya memakai effect mouse pointer di blog

Simak tutorial singat tentang Cara Menambahkan Effect Cursor Mouse di Blog.

Karena arahan yang dipakai ini yakni arahan javascript, Jadi yang perlu teman lakukan yakni memasang arahan di bawah ini di dalam tema atau template teman pada bab tag head ( <head> atau </head>).

#1. Masuk ke " blogger.com "
#2. Sobat menuju ke dashboard blogger klik hidangan Tema > Edit HTML.



#3. Temukan kode </head> didalam dan letakan arahan javascript tersebut sempurna diatasnya, untuk mempermudah teman dalam mencarinya tekan ajah Ctrl + f pada pada keyboard laptop atau komputer sobat.


KODENYA


<script type = "text / javascript"> // <! [CDATA [ var color = "# 666666"; var sparkles = 40;  var x = sapi = 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, tikus, rlef, rdow; untuk (var i = 0; i <berkilau; i ++) { var rats = createDiv (3, 3); rats.style.visibility = "hidden"; document.body.appendChild (kecil [i] = tikus); starv [i] = 0; tinyv [i] = 0; var rats = createDiv (5, 5); rats.style.backgroundColor = "transparan"; rats.style.visibility = "hidden"; var rlef = createDiv (1, 5); var rdow = createDiv (5, 1); rats.appendChild (rlef); rats.appendChild (rdow); rlef.style.top = "2px"; rlef.style.left = "0px"; rdow.style.top = "0px"; rdow.style.left = "2px"; document.body.appendChild (bintang [i] = tikus); } set_width (); berkilau(); }} function sparkle () { var c; if (x! = ox || y! = oy) { sapi = x; oy = y; untuk (c = 0; c <berkilau; c ++) if (! starv [c]) { bintang [c] .style.left = (starx [c] = x) + "px"; bintang [c] .style.top = (stary [c] = y) + "px"; star [c] .style.clip = "rect (0px, 5px, 5px, 0px)"; star [c] .style.visibility = "terlihat"; starv [c] = 50; istirahat; } } untuk (c = 0; c <berkilau; c ++) { if (starv [c]) update_star (c); if (tinyv [c]) update_tiny (c); } setTimeout ("sparkle ()", 40); } function update_star (i) { if (--starv [i] == 25) bintang [i] .style.clip = "rect (1px, 4px, 4px, 1px)"; if (starv [i]) { stary [i] + = 1 + Math.random () * 3; if (stary [i] <shigh + sdown) { bintang [i] .style.top = stary [i] + "px"; starx [i] + = (i% 5-2) / 5; bintang [i] .style.left = starx [i] + "px"; } lain { star [i] .style.visibility = "hidden"; starv [i] = 0; kembali; } } lain { 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 = "terlihat" } } 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"; } lain { tiny [i] .style.visibility = "hidden"; tinyv [i] = 0; kembali; } } lain kecil [i] .style.visibility = "tersembunyi"; } document.onmousemove = mouse; mouse fungsi (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; } lain kalau (document.body.scrollTop || document.body.scrollLeft) { sdown = document.body.scrollTop; sleft = document.body.scrollLeft; } lain kalau (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) { sleft = document.documentElement.scrollLeft; sdown = document.documentElement.scrollTop; } lain { sdown = 0; sleft = 0; } } window.onresize = set_width; function set_width () { if (typeof (self.innerWidth) == "number") { swide = self.innerWidth; shigh = self.innerHeight; } lain kalau (document.documentElement && document.documentElement.clientWidth) { swide = document.documentElement.clientWidth; shigh = document.documentElement.clientHeight; } lain kalau (document.body.clientWidth) { swide = document.body.clientWidth; shigh = document.body.clientHeight; } } function createDiv (tinggi, lebar) { var div = document.createElement ("div"); div.style.position = "absolute"; div.style.height = tinggi + "px"; div.style.width = width + "px"; div.style.overflow = "disembunyikan"; div.style.backgroundColor = warna; return (div); } //]]> </script>




0 Response to "Cara Menambahkan Effect Cursor Mouse Salju Di Blog"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel