Menu icon Foundation
Interchange question

If I have an interchange query with small, medium and large cases, does a large screen load first the small, then the medium and last the large or does it skip small and medium?

interchangemedia queries

If I have an interchange query with small, medium and large cases, does a large screen load first the small, then the medium and last the large or does it skip small and medium?

Malou Geurts over 5 years ago

Foundation was made to be mobile-first. So it'll load the small classes first. So if you don't specify a medium or large class the other screens will inherit from the small setting.

The large does indeed load the small first, but large screens generally have more bandwidth (than small screens), so you won't really notice the difference.

Robin Cox over 5 years ago

Ok, so it will load for example three pictures on a large screen when small, medium and large are specified. Thus a heavy loadtime, but as you say, large screens tend to have more bandwidh. Thanks.

Malou Geurts over 5 years ago

Depends, Foundation itself doesn't load any images just scripts styles. You can use the interchange function to load images depending on viewport size (http://foundation.zurb.com/docs/components/interchange.html). So in that case you wouldn't have to load the mobile images on a large viewport.