Mobile First

[Alfie]

Hi All, have been looking it rewriting one of my existing website using the theory of mobile first, i understand media queries in css, and how they can be used.

I would like some help on how to add content as the screen size goes up i.e. changing the code that displays a static image in a div to a slider and all the mark up that is involved.

I have used display: none before, but as i understand it, the content is still downloaded but just hidden which works but doesn’t help on the amount of data that is being downloaded.

Thanks, Alfie

[Senff]

I agree with @ChrisP — I believe content should always be the same regardless of the device that’s being used. And, images (static or slider) I would consider content too. Having said that, Chris’ solution for response.js would indeed do the trick.

In general however, if you have anything that should not be seen on small screens but should be seen on higher screen widths, the display:none method is the easiest, most straightforward way to do it.

[Alfie]

Thank you for you advise, will have a look at response.js and between that and display:none should be all i need.

[Author]

Posts