Determining if the screen gets too small to display the page

Is there a way to detect when the user resizes the screen below a certain width and height and show a div with a message (in a div) sayi开发者_StackOverflow社区ng the window has become too small to properly display the page?

var resizeTimer;

function nagOnResize() {
    //pause for 1/4 of a second to see if the window stopped moving
    clearTimeout(resizeTimer);
    resizeTimer = setTimeout(doNagOnResize, 250);
}

function doNagOnResize() {
    $(window).unbind('resize', nagOnResize); //pause the event
    var h = $(window).height(), w = $(window).width();
    if(w < 300) {
        alert("< 300px wide");
    }
    $(window).resize(nagOnResize); //continue the event
};

$(window).resize(nagOnResize);

Live example: http://jsfiddle.net/FWhgT/

You should do something like

var nagOnResize = function() {
    var h = $(window).height(), w = $(window).width();
    // change the condition as needed
    if(w < 300) {
        // make it $("#nag").show(); if you want
        alert("< 300px wide");
    }
    // Recursive call. Not binding to $(window).resize as it's fired way too many times on some browsers
    setTimeout(nagOnResize, 100);
};

nagOnResize();

Live demo: http://jsfiddle.net/ajVpG/1/ (Decrease browser width to make the Result iframe < 300px)