amitabhaghosh197
1/28/2015 - 10:15 AM

window resize latest

window resize latest

<script>
function resize_viewport(){
		
		function viewport()
		//Code taken from : http://andylangton.co.uk/blog/development/get-viewport-size-width-and-height-javascript
						{
						var e = window
						, a = 'inner';
						if ( !( 'innerWidth' in window ) )
						{
						a = 'client';
						e = document.documentElement || document.body;
						}
						return { width : e[ a+'Width' ] , height : e[ a+'Height' ] }
						}//viewport()
		 
		
			         
				    $(window).resize( function(){
						
						if( viewport().width < 767 ){
		                      $('body').addClass('new-body');
		                       alert("Hi your window resolution is : " + window.innerWidth);
		                       } 
		
						});//window.resize
				
		
	                        }//resize_viewport()
   
   $(document).ready(function(){
	   resize_viewport();
	   
	   });//doc.ready
			
		
		
	
		
	
</script>
<!doctype html>
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <style type="text/css">@-ms-viewport{width:device-width}</style>
<title>Untitled Document</title>

<style>
.new-body{
	background:#0C9;
	}
.lg-body{ background:#9F0;}
</style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="viewportSize.js"></script>
<script>
function resize_viewport(){
		
 var width = viewportSize.getWidth();
 var height = viewportSize.getHeight(); 
				   
	if( width < 767 ){
		       $('body').addClass('new-body');
		         alert("Hi your window resolution is : " + window.innerWidth + " , height :" + window.innerHeight);
		         }
							   
			if( width > 767 ){
			$('body').addClass('lg-body');
			alert("Hi your window resolution is : " + window.innerWidth + " , height :" + window.innerHeight);
							} 
		
	                        }//resize_viewport()
   
   $(document).ready(function(){
	   resize_viewport();
	   
	   });//doc.ready
			
	
</script>

</head>

<body>
</body>
</html>