Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Change Media Query</title>
<style type="text/css">
p { color: green }
@media (max-width: 320px) {
  p { color: red }
}
</style>
<meta charset="UTF-8">
</head>
<body>
<p>This is text turns red after two seconds</p>
<script>
setTimeout(function() {
    var sheets, sheetIndex, ruleIndex, sheet, rules, rule, media;
  
    sheets = document.styleSheets;
    for (sheetIndex = 0; sheetIndex < sheets.length; ++sheetIndex) {
      sheet = sheets[sheetIndex];
      rules = sheet.cssRules || sheet.rules;
      for (ruleIndex = 0; ruleIndex < rules.length; ++ruleIndex) {
        rule = rules[ruleIndex];
        if (rule.media && rule.media.mediaText === "(max-width: 320px)") {
          console.log("Changing 320px rule to 2000px");
          rule.media.mediaText = "(max-width: 2000px)";
        }
      }
    }
}, 2000);
</script>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers