Details
-
Type:
Bug
-
Status: Closed
-
Priority:
Major
-
Resolution: Fixed
-
Affects Version/s: 3.2.BETA1
-
Fix Version/s: 3.2
-
Component/s: ACE-Components
-
Labels:None
-
Environment:IE8 (both document modes: IE7 compatibility and IE8)
Description
If you set ace:tooltip to position="xxxRight" and targetPosition="xxxLeft" (so that the tooltip should be placed on the left side of the target control) then the tooltip is not aligend correctly when hovering the target control the first time. The tooltip is displayed on the right side, depending on its size. Afterwards it is aligned correctly.
The same happens if you set position="bottomXXX" and targetPosition="topXXX", then the tooltip is displayed beneth where it should be, regarding its size. This also happens only the first time hovering.
Activity
- All
- Comments
- History
- Activity
- Remote Attachments
- Subversion
This problem also happens with IE9.
The problem only happens when there are images in the tooltip body. If the body only contains text, the position is calculated correctly. The workaround is to simply set specific dimensions to all the images in the tooltip. For example:
<h:graphicImage id="img3" value="#
" alt="#
{tooltipOverviewBean.carSet[3].description}" width="100" height="100"/>
This problem had already been reported in the qtip forums: http://craigsworks.com/projects/forums/thread-solved-qtip-in-ie8-not-pointing-to-spot-it-should
Committed fix to trunk at revision 31808.
Added logic to pre-calculate the img elements' dimensions inside the tooltip content, so that the initial positioning is accurate in IE8 and IE9. IE needs to display/draw the image first on the page in order to know it's dimensions.
Several approaches were tried, including modifying the qtip code to re-calculate positioning once the tooltip had been rendered, but this always caused the tooltip to first be displayed in the incorrect position and then suddenly move to the correct position. All the trivial approaches had no success. Other more complex approaches that tried to set explicit dimensions to the images were tried as well, but they didn't work for different reasons.
As for IE7, none of the approaches and workarounds worked, not even setting the dimensions of the image explicitly in the markup. IE7 simply doesn't provide the tools to implement any possible solution.
Open for attachment.
The two screenshots show the first and the second hover in the IceFaces Showcase with IE 8.0.7601 in IE7 compat mode.