metafizzy / outlayer

:construction_worker: the brains & guts of a layout library
163 stars 63 forks source link

Update to 1.4.1 breaks transitions when using percentPosition:true #37

Closed catearcher closed 9 years ago

catearcher commented 9 years ago

Commit 2a462d0776b8cae58d378305c42310b3e5b4061e breaks all translate3d transitions, if using percentPosition:true. I tested this using Isotope 2.2.1 in the newest versions of Chrome, Firefox and Internet Explorer.

Reason for the transitions breaking: Since the update, the x and y values for translate3d are not in pixels anymore, but in %. The values that are being used here are those returned from Item.prototype.getXValue. This works perfectly fine for Item.prototype.layoutPosition, but not for Item.prototype._transitionTo, because percent values in translate3d are not relative to the item's parent, but relative to the item itself.

See this StackOverflow thread: http://stackoverflow.com/questions/25046493/transform3d-using-percentage-to-move-within-parent-object

I constructed a very basic example to demonstrate this: https://jsfiddle.net/51vL64df/ Try resizing the output! If the width goes below 800px, responsiveness kicks in and Isotope tries transitioning all items to their new positions.

desandro commented 9 years ago

Thanks for reporting this issue. This will be resolved in the next release. Fixed in SHA: 758cd0f6c0c36551221e7b7c98278ab837476fc7

desandro commented 9 years ago

Related metafizzy/isotope#948