bohnman
19 Aug 2008, 11:41 AM
The function getPosition in BoxComponent is off by 2 pixels in the x and y values in IE 7 only. IE 6, FireFox, and Safari seem to not have the problem. For example the following code alerts the following in non-IE7 browsers:
Initial Position: 100,100
Current Position: 200,200
In IE7, it prints:
Initial Position: 102,102
Current Position 202,202
Here's the example code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>getPosition IE7</title>
<script type="text/javascript" src="js/ext-2.2/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="js/ext-2.2/ext-all-debug.js"></script>
<link rel="stylesheet" type="text/css" href="js/ext-2.2/resources/css/ext-all.css" />
<style type="text/css">
body {
padding: 0;
margin: 0
}
</style>
<script type="text/javascript">
Ext.onReady(function() {
Ext.dd.DragDropMgr.mode = Ext.dd.DragDropMgr.INTERSECT;
var items = [
{
xtype: 'panel',
id: 'foo',
floating: true,
width : 300,
height: 200,
x: 100,
y: 100,
html: "Here I am. Rock me like a hurricane."
}
];
var viewport = new Ext.Viewport({
items : items
});
var panel = Ext.getCmp('foo');
var initialPos = panel.getPosition();
panel.setPosition(200, 200);
var newPosition = panel.getPosition();
alert('Initial Position: ' + initialPos + "\nCurrent Position: " + newPosition);
});
</script>
</head>
<body>
</body>
</html>
Initial Position: 100,100
Current Position: 200,200
In IE7, it prints:
Initial Position: 102,102
Current Position 202,202
Here's the example code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>getPosition IE7</title>
<script type="text/javascript" src="js/ext-2.2/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="js/ext-2.2/ext-all-debug.js"></script>
<link rel="stylesheet" type="text/css" href="js/ext-2.2/resources/css/ext-all.css" />
<style type="text/css">
body {
padding: 0;
margin: 0
}
</style>
<script type="text/javascript">
Ext.onReady(function() {
Ext.dd.DragDropMgr.mode = Ext.dd.DragDropMgr.INTERSECT;
var items = [
{
xtype: 'panel',
id: 'foo',
floating: true,
width : 300,
height: 200,
x: 100,
y: 100,
html: "Here I am. Rock me like a hurricane."
}
];
var viewport = new Ext.Viewport({
items : items
});
var panel = Ext.getCmp('foo');
var initialPos = panel.getPosition();
panel.setPosition(200, 200);
var newPosition = panel.getPosition();
alert('Initial Position: ' + initialPos + "\nCurrent Position: " + newPosition);
});
</script>
</head>
<body>
</body>
</html>