Having issues with picturefill and isotope…

[albi]

Hi scottjehl,

having an issue with the method picturefill and Isotope (latest). Picturefill is running in the head and Isotope at the end (combined with other scripts). Even wrapping document ready around isotope won't layout all tiles properly. Some of them are displayed above others. Mostly at the end of the site.

Is there any callback to start the isotope layout after picturefill is done?

Example: … (removed)
Kind regards
Alex

[aFarkas]

I assume you are using imagesLoaded? In general imagesLoaded does not support responsive images. We have multiple issues about this.

Here is a simple imagesLoaded jQuery plugin, that actually works with responsive images.

But I would strongly discourage from actually using it. Waiting until all images are loaded until doing layout is so out of time (It is really bad practice!).

The best thing you can do is to use the CSS intrinsic pattern to solve your problem. Also picturefill does not need a ready event here. There is the browsers own event called onload. To make things short, here is a similar question and the answer providing 3 solutions in another repo, but heavily related to picturefill.

See also this thread, there might be coming a native standard solution to the problem.

[albi]

Hi aFarkas,

you are right. I will go with the intrinsic pattern! That should solve my problems and is a modern approach.

Kind regards
Alex