jQuery: Show message on limit size

Util for display information when window size changes.

by Porfirio Chavez

HTML

<div id="portada">
    <div id="info"></div>
    <div class="mostrar"></div>
    <p>
    Note: Resize window under 300px of any
    </p>
</div>

CSS

body {
  background-color: #fde3d9;
}
.destacado {
    background-color: #FCC;
    border: thin #000 solid;
    width: 100px;
    height: 100px;
}

JavaScript

function showWindowSize() {
  $("#info").html(
    "Windows size: " + $(window).width() + " x " + $(window).height()
  );
}

function verifySize(){
 if ($(window).width() < 300 || $(window).height() < 300) {
      $("div#portada .mostrar").html(
        '<div class="destacado"><h1>Hey Dude !</h1></div>'
      );
    } else {
      $("div#portada div.destacado").remove();
    }
}

$(document).ready(function() {
  showWindowSize();
          verifySize();
  $(window).resize(function() {
        showWindowSize();
        verifySize();
  });
});