CodeStyleMenu

Kamis, 18 Oktober 2012

Membuat efek mouse unik menari dengan javascript

Kali ini kita akan membuat efek pada kursor mouse dengan tiga buah warna yang menari nari di sekelilingnya..
Kayak striptcase aja deh..Hehe...

Nah ini kode javascriptnya yang kamu copas di widget atau posting kamu..
<script language="JavaScript">
//by ycusoy
var a_Colour="red";
var b_Colour="blue";
var c_Colour="green";
var Size=40;

//Alter nothing below !!

var YDummy=new Array(),XDummy=new Array(),xpos=0,ypos=0,ThisStep=0;step=0.03;
if (document.layers){
window.captureEvents(Event.MOUSEMOVE);
function nsMouse(evnt){
xpos = window.pageYOffset evnt.pageX 6;
ypos = window.pageYOffset evnt.pageY 16;
}
window.onMouseMove = nsMouse;
}
else if (document.all)
{
function ieMouse(){
xpos = document.body.scrollLeft event.x 6;
ypos = document.body.scrollTop event.y 16;
}
document.onmousemove = ieMouse;
}

function swirl(){
for (i = 0; i < 3; i )
{
YDummy[i]=ypos Size*Math.cos(ThisStep i*2)*Math.sin((ThisStep)*6);
XDummy[i]=xpos Size*Math.sin(ThisStep i*2)*Math.sin((ThisStep)*6);
}
ThisStep =step;
setTimeout('swirl()',10);
}

var amount=10;
if (document.layers){
for (i = 0; i < amount; i )
{
document.write('<layer name=nsa' i ' top=0 left=0 width=' i/2 ' height=' i/2 ' bgcolor=' a_Colour '></layer>');
document.write('<layer name=nsb' i ' top=0 left=0 width=' i/2 ' height=' i/2 ' bgcolor=' b_Colour '></layer>');
document.write('<layer name=nsc' i ' top=0 left=0 width=' i/2 ' height=' i/2 ' bgcolor=' c_Colour '></layer>');
}
}
else if (document.all){
document.write('<div id="ODiv" style="position:absolute;top:0px;left:0px">'
'<div id="IDiv" style="position:relative">');
for (i = 0; i < amount; i )
{
document.write('<div id=x style="position:absolute;top:0px;left:0px;width:' i/2 ';height:' i/2 ';background:' a_Colour ';font-size:' i/2 '"></div>');
document.write('<div id=y style="position:absolute;top:0px;left:0px;width:' i/2 ';height:' i/2 ';background:' b_Colour ';font-size:' i/2 '"></div>');
document.write('<div id=z style="position:absolute;top:0px;left:0px;width:' i/2 ';height:' i/2 ';background:' c_Colour ';font-size:' i/2 '"></div>');
}
document.write('</div></div>');
}
function prepos(){
var ntscp=document.layers;
var msie=document.all;
if (document.layers){
for (i = 0; i < amount; i )
{
if (i < amount-1)
{
ntscp['nsa' i].top=ntscp['nsa' (i 1)].top;ntscp['nsa' i].left=ntscp['nsa' (i 1)].left;
ntscp['nsb' i].top=ntscp['nsb' (i 1)].top;ntscp['nsb' i].left=ntscp['nsb' (i 1)].left;
ntscp['nsc' i].top=ntscp['nsc' (i 1)].top;ntscp['nsc' i].left=ntscp['nsc' (i 1)].left;
}
else
{
ntscp['nsa' i].top=YDummy[0];ntscp['nsa' i].left=XDummy[0];
ntscp['nsb' i].top=YDummy[1];ntscp['nsb' i].left=XDummy[1];
ntscp['nsc' i].top=YDummy[2];ntscp['nsc' i].left=XDummy[2];
}
}
}
else if (document.all){
for (i = 0; i < amount; i )
{
if (i < amount-1)
{
msie.x[i].style.top=msie.x[i 1].style.top;msie.x[i].style.left=msie.x[i 1].style.left;
msie.y[i].style.top=msie.y[i 1].style.top;msie.y[i].style.left=msie.y[i 1].style.left;
msie.z[i].style.top=msie.z[i 1].style.top;msie.z[i].style.left=msie.z[i 1].style.left;
}
else
{
msie.x[i].style.top=YDummy[0];msie.x[i].style.left=XDummy[0];
msie.y[i].style.top=YDummy[1];msie.y[i].style.left=XDummy[1];
msie.z[i].style.top=YDummy[2];msie.z[i].style.left=XDummy[2];
}
}
}
setTimeout("prepos()",10);
}
function Start(){
swirl(),prepos()
}
window.onload=Start;
// -->
</script>

bagaimana, keren kan..

Tidak ada komentar:

Posting Komentar

Berkomentarlah jika ada pertanyaan seputar artikel ini dengan santun bahasa Indonesia yang baik.

This Template - a Admin theme from yanto Cusoy. Converted by Bisnis Indonesia Baru.