#9797 closed bug (worksforme)

Opened February 07, 2014 04:47PM UTC

Closed February 10, 2014 09:50PM UTC

CSS overflow causes jQuery UI Position to be off by a noticeable amount of pixels.

Reported by: cesar.rojas Owned by: cesar.rojas
Priority: minor Milestone: none
Component: ui.position Version: 1.10.4
Keywords: Cc:
Blocked by: Blocking:
Description

When any DOM element is positioned close to the end of css overflow window, the position may be off by a small but noticeable amount of pixels.

Below our pictures of the jQuery Position Online Demo running on the latest version of chrome. Behavior is the same accross all modern browsers.

Settings

[[Image(source:http://s19.photobucket.com/user/Uber_bum/media/jQuery%20UI%20Bug/Settings_zps72a92e3e.png.html)]]

Undesired Offset

[[Image(source:http://i19.photobucket.com/albums/b185/Uber_bum/jQuery%20UI%20Bug/Bug_zpsf0c3428d.png)]]

Attachments (0)
Change History (5)

Changed February 07, 2014 04:49PM UTC by cesar.rojas comment:1

_comment0: [] → 1391791815373455

Changed February 07, 2014 04:52PM UTC by cesar.rojas comment:2

_comment0: This ticket system is terrible. Anyways, I have links to the images I intended to show. \ \ Settings \ [http://s19.photobucket.com/user/Uber_bum/media/jQuery%20UI%20Bug/Settings_zps72a92e3e.png.html] \ \ Undesired Offset| \ [http://i19.photobucket.com/albums/b185/Uber_bum/jQuery%20UI%20Bug/Bug_zpsf0c3428d.png] → 1391792015077175

This ticket system is terrible. Anyways, I have links to the images I intended to show.

Settings

http://i19.photobucket.com/albums/b185/Uber_bum/jQuery%20UI%20Bug/Settings_zps72a92e3e.png

Undesired Offset|

http://i19.photobucket.com/albums/b185/Uber_bum/jQuery%20UI%20Bug/Bug_zpsf0c3428d.png

Changed February 07, 2014 05:15PM UTC by scottgonzalez comment:3

owner: → cesar.rojas
status: new → pending

As the red box says, please provide a reduced test case showing the problem. Screenshots can't be debugged.

Changed February 10, 2014 09:42PM UTC by cesar.rojas comment:4

status: pending → new

I can't remove the red boxes. My last comment provides the screenshots that illustrate the problem.

This issue exists in my project and the JQuery UI Position Live demo; which is why I don't provide a jsfiddle because you can just go to the live demo to reproduce the error.

Steps to reproduce.

1) Go to the jQuery UI Position Live Demo site. http://jqueryui.com/position/

2) Set "my" to "left center"

3) Set "at" to "right center"

4) set "collision" to "flip flip"

5) drag the orange box to the far right of the iFrame so that the overflow appears.

6) You will see that the DOM objects being positioned by the position utility has an erroneous offset that makes it appear a bit off to the left.

Note that in my project I only set the position once, so it has nothing to do with how the live demo is setting the position as you drag it. The problem lies when you use the position utility on an object that is close to the css overflow.

Changed February 10, 2014 09:50PM UTC by scottgonzalez comment:5

resolution: → worksforme
status: new → closed

The only offset I see occurs when the browser scrolls during the drag, which occurs after the positioning.