desandro/masonry — Issue #163: repositioning bricks problem with isAnimated: !Modernizr.csstranistions
Author: myradon
Created: 2012-01-04 10:24:30+00:00
State: open

First of all this project is awesome!

I've stumbled upon a problem which I can't understand. Okay first the code;

the Masonry-container with class masonry assigned to will change width based on MQs. When changing width of this container the masonry-bricks will re-flow BUT sometimes the position is not correct. All bricks will be displayed underneath each other. When resizing the viewport at re-flows into correct location. Fiddling with CSS3 Transitions in sync with bricks doesn't help, neither does delaying container.

Example with CSS3-transitions;

http://twitter.testing.oec.nl/?site_id=7741&ccdb_theme=ccdbbasis&kentekens=09TFFN:67TPKG:01HKGB:06TXHN:08VZDV:17RHKT:29HRL4:38VNK8:56FZTJ:60TDHR:80BZGG:80HDP4:81BZGG:83VLF3:59BSXZ:59TSNZ:52XTZK:52GBK6:06LSJ9:22BSLV:3VBH76:81BVBB

When assigning "true" to property isAnimated jQuery will always do the animations correct.

Example with jQuery Always animations;

http://twitter.customerconnect.nl/themes/TwitterDefault/?site_id=7741&ccdb_theme=ccdbbasis&kentekens=09TFFN:67TPKG:01HKGB:06TXHN:08VZDV:17RHKT:29HRL4:38VNK8:56FZTJ:60TDHR:80BZGG:80HDP4:81BZGG:83VLF3:59BSXZ:59TSNZ:52XTZK:52GBK6:06LSJ9:22BSLV:3VBH76:81BVBB

What could cause this odd behaviour? It's a petty when we couldn't use the benifites of CSS3 in this project.