#15290 new bug ()

Opened April 26, 2018 02:04PM UTC

Last modified April 27, 2018 08:34AM UTC

Position feedback - my element inside at element

Reported by: mburisin Owned by:
Priority: minor Milestone: none
Component: ui.position Version: 1.12.1
Keywords: Cc:
Blocked by: Blocking:
Description

When positioned element is inside target element, the position numbers are calculated correctly, however feedback is calculated incorrectly when my, and at parameters are set to same value.

For example:

my: "left bottom",
at: "left bottom"

and

my: "right top",
at: "right top"

are giving feedback

horizontal: "center", 
vertical: "middle"

With different values, it gives the position correctly

my: "right top",
at: "left bottom"

gives 

horizontal: "right", 
vertical: "top"

CodePen here: https://codepen.io/anon/pen/ZopvXL#anon-login

EDIT: I'm getting some weird behavior in many cases and I can't understand very well what horizontal & vertical feedback values mean. Maybe behavior described above is not incorrect and it works as intended. Would be nice to have explanation in documentation what these values means and how are they calculated.

Attachments (0)
Change History (3)

Changed April 26, 2018 06:42PM UTC by rjollos comment:1

description: When positioned element is inside target element, the position numbers are calculated correctly, however feedback is calculated incorrectly when my, and at parameters are set to same value. \ \ For example: \ \ my: "left bottom", \ at: "left bottom" \ \ and \ \ my: "right top", \ at: "right top" \ \ are giving feedback \ \ horizontal: "center", vertical: "middle" \ \ With different values, it gives the position correctly \ \ my: "right top", \ at: "right top" \ \ gives horizontal: "right", vertical: "top" \ \ CodePen here: https://codepen.io/anon/pen/ZopvXL#anon-login → When positioned element is inside target element, the position numbers are calculated correctly, however feedback is calculated incorrectly when my, and at parameters are set to same value. \ \ For example: \ \ {{{#!javascript \ my: "left bottom", \ at: "left bottom" \ }}} \ \ and \ \ {{{#!javascript \ my: "right top", \ at: "right top" \ }}} \ \ are giving feedback \ \ {{{#!javascript \ horizontal: "center", \ vertical: "middle" \ }}} \ \ With different values, it gives the position correctly \ \ {{{#!javascript \ my: "right top", \ at: "right top" \ }}} \ \ gives \ \ {{{#!javascript \ horizontal: "right", \ vertical: "top" \ }}} \ \ CodePen here: https://codepen.io/anon/pen/ZopvXL#anon-login

Changed April 27, 2018 07:25AM UTC by mburisin comment:2

description: When positioned element is inside target element, the position numbers are calculated correctly, however feedback is calculated incorrectly when my, and at parameters are set to same value. \ \ For example: \ \ {{{#!javascript \ my: "left bottom", \ at: "left bottom" \ }}} \ \ and \ \ {{{#!javascript \ my: "right top", \ at: "right top" \ }}} \ \ are giving feedback \ \ {{{#!javascript \ horizontal: "center", \ vertical: "middle" \ }}} \ \ With different values, it gives the position correctly \ \ {{{#!javascript \ my: "right top", \ at: "right top" \ }}} \ \ gives \ \ {{{#!javascript \ horizontal: "right", \ vertical: "top" \ }}} \ \ CodePen here: https://codepen.io/anon/pen/ZopvXL#anon-login → When positioned element is inside target element, the position numbers are calculated correctly, however feedback is calculated incorrectly when my, and at parameters are set to same value. \ \ For example: \ \ {{{#!javascript \ my: "left bottom", \ at: "left bottom" \ }}} \ \ and \ \ {{{#!javascript \ my: "right top", \ at: "right top" \ }}} \ \ are giving feedback \ \ {{{#!javascript \ horizontal: "center", \ vertical: "middle" \ }}} \ \ With different values, it gives the position correctly \ \ {{{#!javascript \ my: "right top", \ at: "left bottom" \ }}} \ \ gives \ \ {{{#!javascript \ horizontal: "right", \ vertical: "top" \ }}} \ \ CodePen here: https://codepen.io/anon/pen/ZopvXL#anon-login

Changed April 27, 2018 08:34AM UTC by mburisin comment:3

description: When positioned element is inside target element, the position numbers are calculated correctly, however feedback is calculated incorrectly when my, and at parameters are set to same value. \ \ For example: \ \ {{{#!javascript \ my: "left bottom", \ at: "left bottom" \ }}} \ \ and \ \ {{{#!javascript \ my: "right top", \ at: "right top" \ }}} \ \ are giving feedback \ \ {{{#!javascript \ horizontal: "center", \ vertical: "middle" \ }}} \ \ With different values, it gives the position correctly \ \ {{{#!javascript \ my: "right top", \ at: "left bottom" \ }}} \ \ gives \ \ {{{#!javascript \ horizontal: "right", \ vertical: "top" \ }}} \ \ CodePen here: https://codepen.io/anon/pen/ZopvXL#anon-login → When positioned element is inside target element, the position numbers are calculated correctly, however feedback is calculated incorrectly when my, and at parameters are set to same value. \ \ For example: \ \ {{{#!javascript \ my: "left bottom", \ at: "left bottom" \ }}} \ \ and \ \ {{{#!javascript \ my: "right top", \ at: "right top" \ }}} \ \ are giving feedback \ \ {{{#!javascript \ horizontal: "center", \ vertical: "middle" \ }}} \ \ With different values, it gives the position correctly \ \ {{{#!javascript \ my: "right top", \ at: "left bottom" \ }}} \ \ gives \ \ {{{#!javascript \ horizontal: "right", \ vertical: "top" \ }}} \ \ CodePen here: https://codepen.io/anon/pen/ZopvXL#anon-login \ \ EDIT: I'm getting some weird behavior in many cases and I can't understand very well what horizontal & vertical feedback values mean. Maybe behavior described above is not incorrect and it works as intended. Would be nice to have explanation in documentation what these values means and how are they calculated.