Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
experimentally extended Media queries for Elements
JavaScript
branch: master
Failed to load latest commit information.
README.md
index.js first version
test.html

README.md

element-queries

experimental: Media queries extended for elements.

Uses css-parser. Needs jQuery.

.widget {
    width:100px;
    height:100px;
    background:blue;
}

 @media only screen and (element: .widget) and (element-width: 100px) {
    .widget {
        background:green;
    }
}

see the test.html file for more. Call the script after pageload via

elementQueries.parse();

The (element: .widget) should match elements selected via 'querySelectorAll' You can use the following conditions:

element-min-width,
element-max-width,
element-width,
element-min-height,
element-max-height,
element-height

for example

 @media only screen and (element: .widget) and (element-max-height: 30px)
Something went wrong with that request. Please try again.