Ouput all the page's media queries in a list
Posted
by
alecrust
on Stack Overflow
See other posts from Stack Overflow
or by alecrust
Published on 2012-09-16T21:23:45Z
Indexed on
2012/09/16
21:37 UTC
Read the original article
Hit count: 296
Using JavaScript, what would be the best way to output a list containing all media queries that are being applied to the current page.
I assume this would need to filtering to find embedded media queries i.e.
<link rel="stylesheet" media="only screen and (min-width: 30em)" href="/css/30em.css">
as well as media queries located in CSS files, i.e.
@media only screen and (min-width: 320px) {}
An example output of what I'm looking for:
<p>There are 3 media queries loaded on this page</p>
<ol>
<li>30em</li>
<li>40em</li>
<li>960px</li>
</ol>
© Stack Overflow or respective owner
