Detect if iframe webpage is responsive

Question

Is it possible to detect if a website (loaded in an iframe) is responsive or not? Can I fetch css media queries using javascript?

I need to identify the width/height parameters at which the responsiveness kicks in.

Any help will be appreciated. Thanks!

Answer 1

Guess, you could try smth. like:

//go throw all stylesheets
var isResponsive = false;
$.each(document.styleSheets, function(sheetIndex, sheet) {
  //until found
  if (!isResponsive) {
    $.each(sheet.cssRules || sheet.rules, function(ruleIndex, rule) {
        //if contains MediaQuery - go out
        if (!!rule.media) {
           isResponsive = true;
           return false;
        }
    });
  };
});

It works fine document, but could be blocked by security policy in case of iframe.

UPD: Also, you always able to get a page from another domain using JSONP and execute the code above for it's content.