Load section only on screen size > phone

Hey guys,

how can I allow make content only LOAD on certain screen sizes? I have turned off the visibility for phones, yet it loads the section in the background which means that it also loads all its included images.

What I am trying to achieve is that certain images are not loaded on mobile devies. I know how to hide these images, but I am not able to prevent them from loading in the background. The discussion was [also held before] (Don't load section on mobile view), without yielding an answer that I can work with.

Best regards and thanks a lot!

I don’t have a full solution for you issue but:

  • more and more modern browsers won’t load display:none images when they don’t need to
  • If you make the image a background-image of a div in CSS, when that div is set to “display: none”, the image will not load. (When CSS is disabled, it still will not load, because… CSS is disabled)

Thanks for the replies. The idea with the background image is pretty great, thanks!

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.