search

qTip2 / qTip2

qTip2 - Pretty powerful tooltips
MIT License
2k stars 465 forks source link

iPad positioning when zoomed #18

Closed markedwards closed 13 years ago

markedwards commented 13 years ago

On an iPad running iOS 3.2.2, if the page is at all zoomed when a tooltip is triggered, it's position is radically incorrect, unless the screen is scrolled all the way top and left. It behaves as if the position of the target assumes the viewport is the page. The tooltip is placed on the page where it would be if the screen were scrolled all the way top and left.

Interestingly, this behavior is correct on an iPhone running iOS 4.1, which suggests that it will change when iPads get the 4.x update. Still, if it is possible to correct this behavior in qTip, I think it makes sense to.

Craga89 commented 13 years ago

Mark, could you possibly test to see if this is fixed in the latest branch release?

markedwards commented 13 years ago

I am using this version:

http://github.com/Craga89/qTip/blob/master/dist/jquery.qtip.min.js

Is that the latest?

markedwards commented 13 years ago

Just to add a note to this -- its not zooming that's causing the issue, its scrolling. If the window is scrolled anything other than full left and top, positioning is off. Zooming is actually irrelevant.

Craga89 commented 13 years ago

Yep that's the latest. I just updated the code a bit, is this still happening?

markedwards commented 13 years ago

Still happening, I'm afraid. This issue is actually an open bug on the jQuery tracker:

http://bugs.jquery.com/ticket/6446

Its listed as happening in iOS 4.0.4, so my guess is Apple fixed this in 4.1, because an iPhone running 4.1 does not have the problem. There is a workaround suggested in the second comment on the bug page (detecting iOS and subtracting window.scroll values from top and left). Kind of ugly, but so is the tooltip rendering on pre-4.1 iOS devices.

Craga89 commented 13 years ago

Hmm can you test out the latest commit? I expanded the detection to all mobile Safari browsers.

markedwards commented 13 years ago

Okay, that's fixed iPad with iOS 3.2.2, but now the iPhone with iOS 4.1 is broken. I think version number detection might be the only way to detect this, unless you have a way to test for the actual problem. My guess is 4.1 is where it was fixed, but again that is a total guess.

Craga89 commented 13 years ago

Ah my bad I was using >4.1 instead of >4 so it was using the fix on 4.1. Should now be fixed.

markedwards commented 13 years ago

Indeed, it works now in my tests. Thanks for giving this attention!

It might be best to address this with a behavioral test rather than a browser detection, as the situation may change (if jQuery addresses this, for instance). Perhaps there is a way to detect this misbehavior? I will post if I come up with anything.

Thanks again.

markedwards commented 13 years ago

I made a little progress on this. It does indeed seem to be jQuery-specific. Here is a test page:

http://mark.antsclimbtree.com/files/jquery.ipad-test.php

Clicking the yellow square shows the top and left as calculated by jQuery as well as straight javascript. They should be the same, but on iOS <4.1 they are not if you scroll.

One solution might be to not use jQuery to calculate the top and left.