Opened 12 years ago
Closed 12 years ago
#7315 closed bug (notabug)
Tooltip doesn't handle positionning properly when underlying image is zoomed
Reported by: | JayBeavers | Owned by: | |
---|---|---|---|
Priority: | minor | Milestone: | 1.9.0 |
Component: | ui.css-framework | Version: | 1.8.11 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
Creating a UI using jquery ui tooltips and jquery ui theme icons. e.g.
$('<span title="Move next"></span>')
.css('position', 'absolute') .css('top', '45%') .css('left', '100%')
.addClass('ui-state-default ui-corner-all ui-icon ui-icon-arrow-1-e') .tooltip( { predelay: 300 })
Decide that the icons are too small for the application, need to increase their size. Quickly discover that css width/height don't work well with the way the theme icons are cut out of a shared image. Try css zoom like so:
$('<span title="Move next"></span>')
.css('position', 'absolute') .css('top', '45%') .css('left', '100%')
.css('zoom', '200%')
.addClass('ui-state-default ui-corner-all ui-icon ui-icon-arrow-1-e') .tooltip( { predelay: 300 })
Icons are now properly positioned and appropriately sized. Yay!
Uh-oh. Observe that the tooltip positioning is now a-whacko.
Remove the jquery ui tooltip. Observe that the intrinsic tooltip positionning logic is working as expected.
Please report tooltip issues on the forum or planning wiki. We don't accept tickets for unreleased plugins.