I am sharing a very useful bit of code I use to get the window width when making responsive sites.
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<title>Get browser window size using jQuery (useful for responsive testing)</title> | |
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> | |
<script type="text/javascript"> | |
$(window).bind({ | |
load:function(){ | |
var windowSize = $(window).width(); | |
$('p.window-width').text('Window width = ' + windowSize + 'px'); | |
}, | |
resize:function(){ | |
var windowSize = $(window).width(); | |
$('p.window-width').text('Window width = ' + windowSize + 'px'); | |
}, | |
}); | |
</script> | |
</head> | |
<body> | |
<h1>Resize your browser window to get width:</h1> | |
<p class="window-width"></p> | |
</body> | |
</html> |
Please comment below if you have any better solution.