JavaScript code/Cursor tips

Cursor tips Back

Back

********************************************
Free JavaScript provided by Š2003-VB'Breizh

relative topics :Elastic Text Elastic Image

Compatibility : Internet Explorer Avant Browser Opera

Pictures following the cursor...

...I'm following you...

J

...http://gilles.saunier.free.fr...

...Download the JavaScript source code (1.22 kb)

<html><head>
<script language="JavaScript"><!--
var ie = (navigator.appName == "Microsoft Internet Explorer");
if (ie) {layerRef="document.all";styleRef=".style";}

var nn = (navigator.appName == "Netscape");
if (nn) {layerRef="document.layers";styleRef="";}

var tmpX=0;var tmpY=0;
function mouse_pos(k,e) {
  if (ie) { 
    tmpX = event.clientX+document.body.scrollLeft;
    tmpY = event.clientY+document.body.scrollTop;} 
    else {tmpX=e.pageX;tmpY=e.pageY;}  
    if (k==1) {set_love();}
    if (k==2) {set_msg();}
    if (k==3) {set_www();}
    }
function set_love() {
    dot1.style.visibility='visible';
    dot2.style.visibility='visible';
    dot3.style.visibility='visible';
    dot1.style.left=tmpX-10;dot1.style.top=tmpY+15;
    dot2.style.left=tmpX+5;dot2.style.top=tmpY+20;
    dot3.style.left=tmpX+20;dot3.style.top=tmpY;
    }
function set_msg() {
    dot4.style.visibility='visible';
    dot4.style.left=tmpX+10;dot4.style.top=tmpY+10;
    }
function set_www() {
    dot5.style.visibility='visible';
    dot6.style.visibility='visible';
    dot5.style.left=tmpX+15;dot5.style.top=tmpY+10;
    dot6.style.left=tmpX+35;dot6.style.top=tmpY+10;
    }
function hide_love() {
    dot1.style.visibility='hidden';
    dot2.style.visibility='hidden';
    dot3.style.visibility='hidden';
    }
function hide_msg() {dot4.style.visibility='hidden';}
function hide_www() {
    dot5.style.visibility='hidden';
    dot6.style.visibility='hidden';}
--></script></head>
<body style="cursor:default;background:white;">
<font size=2><font color=lightyellow>
<form name='form1' style="background:tan;height:100;" onmousemove='mouse_pos(1)' onmouseout='hide_love()'>
Pictures following the cursor...</form><p><font color=darkred>
<form name='form2' style="cursor:hand;background:beige;height:100;" onmousemove='mouse_pos(2)' onmouseout='hide_msg()'>
Text following the cursor...</form><p><font color=black>
<form name='form3' style="cursor:help;background:wheat;height:100;" onmousemove='mouse_pos(3)' onmouseout='hide_www()'>
Text1+Text2 following the cursor...</form>
<div id="dot1" style="position:absolute;height:8;width:8;visibility:hidden;"><img src="heart.gif" height=8 width=8></div>
<div id="dot2" style="position:absolute;height:8;width:8;visibility:hidden;"><img src="heart.gif" height=8 width=8"></div>
<div id="dot3" style="position:absolute;height:8;width:8;visibility:hidden;"><img src="heart.gif" height=8 width=8></div>
<div id="dot4" style="position:absolute;font-family:arial;font-size:14;visibility:hidden;">...I'm following you...</div>
<div id="dot5" style="position:absolute;font-family:wingdings;color:darkblue;font-size:20;visibility:hidden;">J</div>
<div id="dot6" style="position:absolute;font-family:arial;color:darkblue;font-size:12;visibility:hidden;">...http://gilles.saunier.free.fr...</div>
</body></html>

Comment, question ?