| Issue 373: | DnD node.span incorrect in IE8 | |
| 2 people starred this issue and may be notified of changes. | Back to list |
Within the _onDragEvent in the Over case the nodeOfs, relPos and relPos2 are derived from the node.span. For some reason the position of the span returns incorrect coordinates and a height and width of 0 in IE8 (may be related to some other parent DOM elements).
Changing the code to use the node.li for position works in both IE and FF. The code below was changed from:
var nodeOfs = nodeTag.offset();
// var relPos = { x: event.clientX - nodeOfs.left,
// y: event.clientY - nodeOfs.top };
// nodeOfs.top += this.parentTop;
// nodeOfs.left += this.parentLeft;
var relPos = { x: event.pageX - nodeOfs.left,
y: event.pageY - nodeOfs.top };
var relPos2 = { x: relPos.x / nodeTag.width(),
y: relPos.y / nodeTag.height() };
Changed to:
var liTag = $(node.li);
var nodeOfs = liTag.offset();
var relPos = { x: event.pageX - nodeOfs.left,
y: event.pageY - nodeOfs.top };
var relPos2 = { x: relPos.x / liTag.width(),
y: relPos.y / liTag.height() };
Also changed the position of the marker in _setDndStatus to use the LI for position as below:
this.$dndMarker
.show()
.position({
my: "left top",
at: "left top",
of: $(targetNode.li),//$target, //Use parent LI for position as SPAN returns incorrect coordinates
offset: markerOffset
});
Nov 13, 2012
The problem occurs when the tree is used in our internal contract management system. The DOM hierarchy is very complex and the tree resides in an Infragistic splitter which I know renders with visibility:hidden initially and then changes the DOM on pageLoad (Ajax event). Researching the problem there are reports that it may be related to relative positioning or floats in the parent DOM in elements IE. I've not been able to replicate this issue in a simple html file. For the purpose of the position the LI is located at the same offset at the SPAN and resolves the DND issue in our case.
Nov 27, 2012
This is simply a CSS issue in IE and does not require a JS change.
To fix it in IE "display:inline-block" needs to be added, and do prevent that change from causing spacing problems in firefox "vertical-align: top" also need to be added, like so:
span.dynatree-node
{
display: -moz-inline-box; /* issue 133 , 165, 172, 192, */
display: inline-block;
vertical-align: top;
}
Nov 29, 2012
Thank you. This resolved the issue in our case.
Jan 25, 2013
(No comment was entered for this change.)
Status:
Accepted
Feb 10, 2013
(No comment was entered for this change.)
Labels:
-Milestone-Release1.2.3 Milestone-Release1.2.4
Feb 12, 2013
1.2.4 was a hotfix
Labels:
-Milestone-Release1.2.4 Milestone-Release1.2.5
Sep 8, 2013
(works on Safari) Needs testing in other browsers
Status:
Waiting
Oct 6, 2013
Assume fixed
Status:
Fixed
|
Labels: Milestone-Release1.2.3