Tutorial Blog Unik: Kursor

<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: justify;">
<div style="text-align: left;">
Cara Membuat Tiga Warna Berputar Mengelilingi Kursor - Kali ini, saya akan menjelaskan <a href="http://www.fahmifanirius.ga/2014/06/cara-membuat-tiga-warna-berputar.html" target="_blank">Cara Membuat Objek Keren Berputar Mengelilingi Kursor</a>. Objek atau wiget ini mempunyai 3 warna yg akan berputar dan mengelilingi kursor. Ini, menurut saya sih, keren. Tujuannya, sebagai penghias saja. </div>
 
 Dengan objek atau widget ini, mungkin bisa membuat orang tidak bosan buat template web Anda yang sekiranya terlihat polos atau yang dimaksudkan adalah membosankan. Karena objek atau widget ini terdiri dari tiga warna. 
 
 Objek ini mungkin juga bisa menghibur visitor Anda untuk melihat lebih dekat lagi. Karena objek atau widget ini bisa memusingkan visitor web Anda. (¬_ ¬) 
 
 Mungkin, Anda bisa mencobanya. </div>
<div style="text-align: center;">
 
</div>
<div style="text-align: center;">
 
 
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpyDjcW1eB-k8nkdjP0lyuCFMEAQBY1NFuC0fpwaaP-ioqiAuXRLhHvFo__YDZJS9vGR5HKxRIcfwtF0VMYne_UTfPCDg_qpFajIGpTZtvR7TEsPpCsnwKXi5TKLipnmEa8XyguIvhyOCa/s1600/aa.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Membuat Tiga Warna Berputar Mengelilingi Kursor" border="0" height="89" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpyDjcW1eB-k8nkdjP0lyuCFMEAQBY1NFuC0fpwaaP-ioqiAuXRLhHvFo__YDZJS9vGR5HKxRIcfwtF0VMYne_UTfPCDg_qpFajIGpTZtvR7TEsPpCsnwKXi5TKLipnmEa8XyguIvhyOCa/s1600/aa.gif" title="Cara Membuat Tiga Warna Berputar Mengelilingi Kursor" width="320" /></a></div>
</div>
<div style="text-align: center;">
 
</div>
<div style="text-align: center;">
<div style="text-align: left;">
1. Login blogger</div>
</div>
<div style="text-align: center;">
<div style="text-align: left;">
2. Tata letak/layout</div>
</div>
<div style="text-align: center;">
<div style="text-align: left;">
3. Add gadget</div>
</div>
<div style="text-align: center;">
<div style="text-align: left;">
4. HTML/JavaScript</div>
</div>
<div style="text-align: center;">
<div style="text-align: left;">
5. Copy paste kode berikut ini pada kolom HTML/JavaScript</div>
</div>
<div style="background: #e0eff7; border: 3px dashed #0159f8; height: 400px; overflow: auto; padding: 10px; text-align: left; width: auto;">
<pre><code><script language="JavaScript" type="text/javascript">
var xCol = "#FF0000";
var yCol = "#FFFF00";
var zCol = "#0000FF";

 var n = 6; //number of dots per trail.
var t = 40; //setTimeout speed.
var s = 0.2; //effect speed.

 var r,h,w;
var d = document;
var my = 10;
var mx = 10;
var stp = 0;
var evn = 360/3;
var vx = new Array();
var vy = new Array();
var vz = new Array();
var dy = new Array();
var dx = new Array();
var pix = "px";
var strictmod = ((document.compatMode) &&
document.compatMode.indexOf("CSS") != -1);

 var domWw = (typeof window.innerWidth == "number");
var domSy = (typeof window.pageYOffset == "number");
var idx = d.getElementsByTagName('div').length;

 for (i = 0; i < n; i++)
{
var dims = (i+1)/2;
d.write('<div id="x'+(idx+i)+'" style="position:absolute;'
+'top:0px;left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+xCol+';font-size:'+dims+'px"><\/div>'
+'<div id="y'+(idx+i)+'" style="position:absolute;top:0px;'
+'left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+yCol+';font-size:'+dims+'px"><\/div>'
+'<div id="z'+(idx+i)+'" style="position:absolute;top:0px;'
+'left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+zCol+';font-size:'+dims+'px"><\/div>');
}

 if (domWw) r = window;
else
{
if (d.documentElement &&
typeof d.documentElement.clientWidth == "number" &&
d.documentElement.clientWidth != 0)
r = d.documentElement;
else
{
if (d.body && typeof d.body.clientWidth == "number")
r = d.body;
}
}

 function winsize()
{
var oh,sy,ow,sx,rh,rw;
if (domWw)
{
if (d.documentElement && d.defaultView &&
typeof d.defaultView.scrollMaxY == "number")
{
oh = d.documentElement.offsetHeight;
sy = d.defaultView.scrollMaxY;
ow = d.documentElement.offsetWidth;
sx = d.defaultView.scrollMaxX;
rh = oh-sy;
rw = ow-sx;
}
else
{
rh = r.innerHeight;
rw = r.innerWidth;
}
h = rh;
w = rw;
}
else
{
h = r.clientHeight;
w = r.clientWidth;
}
}

 function scrl(yx)
{
var y,x;
if (domSy)
{
y = r.pageYOffset;
x = r.pageXOffset;
}
else
{
y = r.scrollTop;
x = r.scrollLeft;
}
return (yx == 0)?y:x;
}

 function mouse(e)
{
var msy = (domSy)?window.pageYOffset:0;
if (!e) e = window.event; 
if (typeof e.pageY == 'number')
{
my = e.pageY - msy + 16;
mx = e.pageX + 6;
}
else
{
my = e.clientY - msy + 16;
mx = e.clientX + 6;
}
if (my > h-65) my = h-65;
if (mx > w-50) mx = w-50;
}

 function assgn()
{
for (j = 0; j < 3; j++)
{
dy[j] = my + 50 * Math.cos(stp+j*evn*Math.PI/180) *

 Math.sin((stp+j*25)/2) + scrl(0) + pix;
dx[j] = mx + 50 * Math.sin(stp+j*evn*Math.PI/180) *

 Math.sin((stp+j*25)/2) * Math.sin(stp/4) + pix;
}
stp+=s;

 for (i = 0; i < n; i++)
{
if (i < n-1)
{
vx[i].top = vx[i+1].top; vx[i].left = vx[i+1].left;
vy[i].top = vy[i+1].top; vy[i].left = vy[i+1].left;
vz[i].top = vz[i+1].top; vz[i].left = vz[i+1].left;
}
else
{
vx[i].top = dy[0]; vx[i].left = dx[0];
vy[i].top = dy[1]; vy[i].left = dx[1];
vz[i].top = dy[2]; vz[i].left = dx[2];
}
}
setTimeout(assgn,t);
}

 function init()
{
for (i = 0; i < n; i++)
{
vx[i] = document.getElementById("x"+(idx+i)).style;
vy[i] = document.getElementById("y"+(idx+i)).style;
vz[i] = document.getElementById("z"+(idx+i)).style;
}
winsize();
assgn();
}

 if (window.addEventListener)
{
window.addEventListener("resize",winsize,false);
window.addEventListener("load",init,false);
document.addEventListener("mousemove",mouse,false);
} 
else
if (window.attachEvent)
{
window.attachEvent("onload",init);
document.attachEvent("onmousemove",mouse);
window.attachEvent("onresize",winsize);
}
</script></code></pre>
</div>
6. Simpan perubahan  
<div style="text-align: justify;">
 
</div>
<div style="text-align: justify;">
<div style="text-align: left;">
*Keterangan: jika sobat kurang suka dengan warna Merah, Kuning, dan Biru. Sobat dapat menggantikannya dengan warna yang sobat suka. (#FF0000 #FFFF00 #0000FF) Silahkan sobat bisa buka <a href="http://www.fahmifanirius.ga/p/blog-page_8.html" target="_blank">KODE WARNA</a> untuk mengetahui kode-kode dari warna yang sobat inginkan.</div>
</div>
 
 
 Jangan lupa, ketika sudah mencoba dan berhasil, beri komentar... Kalau masih gagal, coba lagi. Semoga berhasil... ˆ⌣ˆ 
 
 
<div style="text-align: right;">
<a href="http://www.fahmifanirius.ga/p/tutorial-blogger.html" target="_blank"><strike>Tutorial Blogger</strike></a></div>
<div class="content-box-infoindong">
<div itemscope="" itemtype="http://schema.org/Review">
<div itemprop="itemReviewed" itemscope="" itemtype="http://schema.org/Thing">
</div>
<table><tbody>
<tr align="justify"> <td width="20%">Judul </td> <td width="60%"><div style="text-align: left;">
Cara Membuat Tiga Warna Berputar Mengelilingi Kursor.</div>
</td> </tr>
<tr align="justify"> <td width="20%">Deskripsi </td> <td width="60%"><div style="text-align: justify;">
<div style="text-align: left;">
Cara membuat objek tiga warna berputar mengelilingi kursor blog yang dapat membuat pengunjung Anda pusing dan sebagai penghias blog.</div>
</div>
</td> </tr>
<tr align="justify"> <td width="20%">Author </td> <td width="60%">Google</td> </tr>
<tr align="justify"> <td width="20%">Author Rating </td> <td width="60%"><div itemprop="reviewRating" itemscope="" itemtype="http://schema.org/AggregateRating">
<div style="text-align: left;">
82%/ 100% Suara Dari 1362 votes</div>
</div>
</td></tr>
</tbody></table>
</div>
</div>
</div>

Kursor Tutorial Blogger Widget Cara Membuat Tiga Warna Berputar Mengelilingi Kursor

Cara Membuat Tiga Warna Berputar Mengelilingi Kursor - Kali ini, saya akan menjelaskan Cara Membuat Objek Keren Berputar Mengelilingi Ku...

Cara Membuat Tiga Warna Berputar Mengelilingi Kursor

Cara Membuat Link Warna Warni Di Blog Jika Disentuh Kursor

Terpopuler

Kategori

Arsip Blog