- This topic is empty.
March 4, 2019 at 1:39 pm #284097smthParticipant
The only way I could get any of these scripts behaving reliably was to run them on window.onload. This feels a bit heavy handed, and also like it is fixing the problem by way of an arbitrary delay.
I feel like there should be a way of saying “once the browser knows where everything is, run this”.March 4, 2019 at 3:59 pm #284100ShikkedielParticipant
If there are images that should be included in the calculations,
window.onloadis the way to go. It’s not really heavy handed, it actually meets the criterium of your last sentence – the browser will only know where everything is (or should be placed) once the images are loaded. Placing a script at the bottom of the page only makes sure the page markup itself is read.
onloadisn’t bulletproof when the page uses async script calls but I suppose that isn’t the case here.March 5, 2019 at 12:38 am #284122smthParticipant
I should have mentioned, the content does not determine the layout in any of the examples I am looking at. In the first example there are no images on the page, for both the Popper (the RSS icon), and Swiper examples, the layout is the same if loaded with images disabled.
In all the examples there is either a CSS grid, a flex box, or an absolutely positioned element involved. So the question is more about CSS being loaded (and then, presumably, calculations done), rather than content. What if you don’t want to wait for images to load, but you do need the browser to have figured out a CSS grid for example (by figured out I mean, for example, know what a quarter of the viewport width, minus column gaps is)?