xy.css

Browser Size

Display browser width & height with jQuery

About

Visual Browser Size is a jQuery plugin that displays the browser’s width and height in the corner of the screen. As the browser is resized, the script dynamically displays the current width and height values (in pixels). Super-helpful for doing responsive design.

Visual Browser Size is designed for easy drop-in-anywhere functionality. If you can improve anything in the script, let me know. To see a working demo, resize your browser window and watch the upper-left corner of the screen. Works great in all modern browsers (i.e., not old IE).

How to use

To use, include the Visual Browser Size script and done. It’s a pretty simple script, so no configuration is required. You’ll know it’s working if you see the info box displayed in the upper-left corner of the screen. By default the height and width information is displayed at reduced opacity, but you can hover over the box at any time to view the infos more clearly.

Download

Download Visual Browser Size

The download ZIP file contains the following file:

  • visual-browser-size.js