client detect

by el_chief

HTML

<div class="error" style="display:none;">Really? No CSS? C'mon, man.</div>

<noscript><div class="error" id="js">You need javascript enabled to run this application.</div></noscript>

<div class="warning" id="flash">Your browser appears to not have Flash installed. Certain features will not work without Flash. <a href="http://get.adobe.com/flashplayer/">Get Flash here/</a></div>

<div class="error" id="popups" style="display:none">Your browser is blocking popups. Certain features will not work without popups. <a href="#">How to enable popups</a></div>

CSS

.error, .warning{
padding:3px;
    margin:8px;
}

.error{
border:2px solid red;
    background-color:pink;
    color:red;
    font-weight:bold;
}

.warning{
border:2px solid goldenrod;
    background-color:yellow;
    color:goldenrod;
    font-weight:bold;
}

JavaScript

function isBlockingPopups(callback) {
    var win = open();
    if (typeof win === 'undefined' || win === null) {
        callback(true);
    }
    else {
        setTimeout(function() {
            callback(win.screenX === 0);
            win.close();
        }, 1);
    }

}

window.onload = function() {

    isBlockingPopups(function(blocking) {
        if (blocking) {
            
            document.getElementById('popups').style.display = 'block';
        }
    });

};