Skip to main content

Search and Top Navigation

#7315 closed bug (notabug)

Opened May 03, 2011 11:08PM UTC

Closed May 04, 2011 01:08PM UTC

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.

Attachments (0)
Change History (1)

Changed May 04, 2011 01:08PM UTC by scottgonzalez comment:1

resolution: → invalid
status: newclosed

Please report tooltip issues on the forum or planning wiki. We don't accept tickets for unreleased plugins.