nicht angemeldet
Hallo.
Bei einem Dokument soll ein div eine Zeichenfläche darstellen. Dieser Bereich kann beliebig im Dokument platziert sein. Die obere Linke Ecke soll den Koordinaten 0,0 entsprechen. Also ergab sich für mich folgender Code (mal etwas zusammengekürzt):
--------------------------------------------
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de">
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="layout/layout.css" />
</head>
<body style="margin:0px;">
<script type="text/javascript">
function testfunction(evt, el) {
if(!evt) {
evt = window.event;
}
var element = document.getElementById(el);
rd = getDim(element);
alert((evt.clientX - rd.x) + " " + (evt.clientY - rd.y));
}
function getDim(el) {
var rd = {x:el.offsetLeft,y:el.offsetTop, x0:0, y0:0}, tEl=el.offsetParent;
while (tEl){
rd.x += tEl.offsetLeft;
if(tEl.offsetLeft == 0) {
rd.x0++;
}
rd.y += tEl.offsetTop;
if(tEl.offsetTop == 0) {
rd.y0++;
}
tEl = tEl.offsetParent;
}
return rd;
}
</script>
<br />
<br />
<fieldset>
<div id="img" style="border:0px" onclick="testfunction(event, 'img')">
<img border="0" src="test.png" width="690" />
</div>
</fieldset>
</body>
</html>
-------------------------------------------------------------------
Firefox, Konquerer und Opera liefern die gewünschten Koordinaten, der Internet Explorer (wie zu erwarten...) jedoch nicht.
Der IE liefert immer 2 Pixel mehr pro nicht div Element.
Will heissen:
Klick bei 14, 43 auf die Grafik bringt bei den 3 anderen 14, 43; beim IE 18, 47. Lässt man das fieldset weg bleiben 16, 45 stehen. Legt man das onclick-event direkt auf die Grafik und lässt den div und die beiden Zeilenumbrüche weg bleiben auch 16, 45.
Hat schonmal jmd ähnliches versucht und weiss woher das kommt bzw. ob es immer 2 Pixel sind. Wie lässt sich das umgehen bzw. zuverlässig korigieren ?
Vielen Dank schonmal.
MfG
Gernot Back
Struppi