Q1409 Is it possible to have the position of a layer move with the coordinates of the mouse (without having to click and drag the layer), eg. a horizontal line layer and a verticle line layer, both following the position of the mouse pointer?

You are here: irt.org | FAQ | DHTML | Q1409 [ previous next ]

You may have to adjust the position by adding or subtracting an offset to allow the lines to cross the mouse pointer per browser. The following works perfectly on Netscape Navigator 4.7 on Linux:

<html>
<head>
<script language="JavaScript"><!--
if (document.layers) {
    document.captureEvents(Event.MOUSEMOVE);
    document.onmousemove = myScroll;
}

function myScroll(e) {
    if (document.layers) {
         document.layers['x'].left = e.screenX - window.screenX - (window.outerWidth - window.innerWidth);
         document.layers['y'].top = e.screenY - window.screenY - (window.outerHeight - window.innerHeight) + 25;
    }
    else if (document.all) {
        document.all('x').style.posLeft = window.event.x;
        document.all('y').style.posTop = window.event.y;
    }
}
//--></script>
</head>

<body onMouseMove="myScroll()">

<div id="x" style="position:absolute;"><img src="dot.gif" height="100%" width="1"></div>

<div id="y" style="position:absolute;"><img src="dot.gif" height="1" width="100%"></div>

</body>
</html>