Hi,

Hope you can help. I have the streamlined the code below from my web page. I am testing by running from my PC. I've tested both in IE 10 & Firefox 19.0.2. It works perfectly and I am very happy with the results. However as soon as I put any <!DOCTYPE ... at the top, my DIV stops moving. i.e. skn.left and sk.top don't get assigned the values in function popup. I remove the <!DOCTYPE ... reference from the top of the HTML file and it works again.

Any help will be appreciated and thank you in advance.

The code below can be copied as-is into test.html and will work fine until you add a <!DOCTYPE ... reference on the top line. I've included a display of cursor coordinates as part of my testing.


<html>
<head>
</head>

<body>

<DIV style="position:absolute; left: 20px; top: 300px;" ID="dek" >
<TABLE WIDTH=150 BORDER=1 BORDERCOLOR=black CELLPADDING=2 CELLSPACING=0 BGCOLOR="lightblue"><TD ALIGN=center><FONT COLOR=black SIZE=2>HELLO</FONT></TD></TABLE>
</DIV>
<DIV ID="divCoord"></DIV>


<SCRIPT TYPE="text/javascript">
<!--

var Xoffset= 10; // modify these values to ...
var Yoffset= -40; // change the popup position.
var old,skn,iex=(document.all),yyy=-1000;
var s,tleft,ttop,xtleft,xttop;
var standardbody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body //create reference to common "body" across doctypes
var i,d = 0
var ns4=document.layers;
var ns6=document.getElementById&&!document.all;
var ie4=document.all;

if (ns4)
skn=document.dek;
else if (ns6)
skn=document.getElementById("dek").style;
else if (ie4)
skn=document.all.dek.style;

if(ns4)
{
document.captureEvents(Event.MOUSEMOVE);
}

function popup(msg,bak)
{
var content="<TABLE WIDTH=150 BORDER=1 BORDERCOLOR=black CELLPADDING=2 CELLSPACING=0 "+
"BGCOLOR="+bak+"><TD ALIGN=center><FONT COLOR=black SIZE=2>"+msg+"</FONT></TD></TABLE>";
yyy=Yoffset;
if(ns4){skn.document.write(content);skn.document.close();skn.visibility="visible"}
if(ns6){document.getElementById("dek").innerHTML=content;skn.display=''}
if(ie4){document.all("dek").innerHTML=content;skn.display=''}

xtleft = skn.left;
xttop = skn.top;

skn.left=storage[1]+Xoffset;
skn.top=storage[0]+yyy;

var s = 'XX=' + storage[0] + ' Y=' + storage[1] + ' SX=' + xtleft + ' SY=' + xttop;
document.getElementById('divCoord').innerHTML = s;
}

function initTrail()
{ // prepares the script
storage = new Array() // prepare the storage for the coordinates
storage[0] = 0;
storage[1] = 0;
}

function processEvent(e)
{ // catches and processes the mousemove event
if (window.event)
{ // for IE
storage[0] = window.event.y+standardbody.scrollTop;
storage[1] = window.event.x+standardbody.scrollLeft;
}
else
{
storage[0] = e.pageY;
storage[1] = e.pageX;
}

var s = 'X=' + storage[0] + ' Y=' + storage[1];
document.getElementById('divCoord').innerHTML = s;
}

initTrail()
document.onmousemove = processEvent // start capturing

//-->
</script>


<br><br><br>
<a href="javascript:void(0);" OnClick="popup('TEST','lightblue')" >
TEST LINK 1
</a>


</body>
</html>