iOS support

[jtbr]

Great tool you've got here.

I know you said you've tested it on firefox and chrome, but I was testing it out on Safari for iPad (I have 8.3) and it doesn't seem to be formatting correctly. I'm at a loss as to why. The images always appear as full-width (filling the viewport), so one image per row. It does sometimes flash a more typical configuration with multiple images per row while loading, but immediately settles upon one image per row.

It looks like this is happening on the second call to perfectLayout. I made a few changes to the example codepen (using absolute positioning and reducing the number of calls to perfectLayout). By making only one call to perfect layout, it will render correctly until you rotate the screen (which correctly triggers a resize event and call to perfectLayout). This being the second time, though, it fails and it's back to one image per row (it makes no difference which orientation you go to).

Any ideas what might be going on?

[yckart]

Have you tried to debounce the resize-handler or adding a viewport-meta tag?

[jtbr]

Thanks, yeah I tried using a debounce rather than just checking for a changed width in the resize handler. Also added a viewport: <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />. I made a fork with them both these changes in addition to the earlier ones: http://codepen.io/anon/pen/bpEVPG . Same results though. After changing the screen orientation, at some point you get full viewport-width images on iOS.

Another thing I noticed that seemed strange is that sometimes you get rows returned with no images in them, not sure if that could be related.