Add class or other attribute using media query

css, iphone, javascript, media-queries

Solution

Check out Enquire.js. Lightweight, pure JavaScript library for handling media queries. Looks pretty cool.

Problem

I'm currently using CSS media queries to target some small/medium screen devices like this: ``` @media screen and (min-device-width: 480px) { ... } @media screen and (min-device-width: 720px) { ... } ``` This works as expected, and I can apply styles to some particular selectors, but.. What I was wondering is if there is a way to add a class or other attribute to a selector based on media query. Example of my thought: ``` @media screen and (min-device-width: 480px) { body { addClass('body-iphone') } } ``` Is there a way to do that with CSS or maybe JavaScript?

Original source

Related problems