Friday, November 9, 2007

MOUSE PONTER DETECTION WITH TRANSPARENT DINAMIC DIV

<html>

<head>

<title></title>

<script type="text/JavaScript" language="JavaScript">

<!--

function cleanup(e) {

if (typeof(loopid) != "undefined")

clearInterval(loopid);


document.onmousemove = null;

document.getElementById("malih").style.display = "none";



return true;

}


function trackMove(e) {

if (arguments.length == 0) e = event;


if (document.layers) {

document.f.mX.value = e.pageX;

document.f.mY.value = e.pageY;

}

else {

document.f.mX.value = e.clientX;

document.f.mY.value = e.clientY;

}

document.getElementById("malih").style.display = "block";

document.getElementById("malih").style.left = e.clientX+10;

document.getElementById("malih").style.top = e.clientY+10;

}


function init() {

clickStarted = false;

document.onmousemove = trackMove;

if (document.layers) {

document.captureEvents(Event.MOUSEMOVE);

}

}

//-->

</script>


</head>


<body>


<a href="#" onMouseOver="init();" onMouseOut="cleanup()">ARAHKAN MOUSE KESINI</a>

<form name="f">

MouseMove X: <input type="text" name="mX" value="0" size="4"><br>

MouseMove Y: <input type="text" name="mY" value="0" size="4"><br>


<br><br>


</form>

<div id="malih" style="border:1px solid #000000;position:absolute;width:100px;display:none; background:#cccccc;opacity:0.8;"><br>Tampilan yang harusnya keluar</div>


</body>

</html>

1 comment:

Anonymous said...

Hello. This post is likeable, and your blog is very interesting, congratulations :-). I will add in my blogroll =). If possible gives a last there on my blog, it is about the Flores Online, I hope you enjoy. The address is http://flores-on-line.blogspot.com. A hug.