here is a test:
ps: I found the way to get zoomlevel here.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript">
var dojo = {
byId: function(id) {
return document.getElementById(id) || id;
},
coords: function(node) {
var x, y;
x = y = 0;
while(node) {
x += node.offsetLeft;
y += node.offsetTop;
node = node.offsetParent;
}
return {'x': x, 'y': y};
}
};
function z() {
document.body.style.zoom = 2;
}
function s() {
var rect = document.body.getBoundingClientRect();
var zoomLevel = Math.round( (rect.right-rect.left)/document.body.clientWidth * 100);
dojo.byId('zoom-info').innerHTML =
'zoomLevel:' + zoomLevel + ','
+ 'd.offsetWidth:' + dojo.byId('d').offsetWidth + ','//dojo.style(document.body, 'zoom');
+ 'd.offsetTop:' + dojo.byId('d').offsetTop + ','
+ 'd.style.top:' + dojo.byId('d').style.top + ',';
}
window.onload = function() {
document.attachEvent('onmousemove', function(e) {
e = e || window.event;
var pos = dojo.coords(dojo.byId(d));
dojo.byId('debug').innerHTML = e.clientX + ', ' + e.clientY + ' d.pos:' + pos.x + ',' + pos.y;
s();
}, false);
}
</script>
</head>
<body>
<h1>Test ie zoom</h1>
<span >Hello world!</span>
<div id="debug"></div>
<div id="zoom-info"></div>
<input type="button" value="+" onclick="z()"/>
<input type="button" value="s" onclick="s()"/>
<div id="d" style="position: absolute; top: 200px; left: 500px; background: red; width: 200px; height: 100px;">
position: absolute; top: 200px; left: 50px; background: red; width: 200px; height: 100px;
</div>
</body>
</html>
