Detect Screen height size width Property using Jquery

Detect Screen height size width Property using Jquery

Today, We want to share with you Detect Screen height size width Property using Jquery.
In this post we will show you Detect Screen height size width Property using Jquery, hear for Detect Screen height size width Property using Jquery we will give you demo and example for implement.
In this post, we will learn about Detect Screen height size width Property using Jquery with an example.

This is a simple POST of how to get screen window width size and height size of your browser window using javascript and jquery.

Read Also:  php ajax post - jQuery AJAX Post Example with PHP and JSON

jQuery simple outerWidth() function and outerHeight() function or methods. The outerWidth() method returns simple the width of an each element (includes all padding and same border). The outerHeight() method returns the all height of an each element (includes same padding and border).

Dimensions : height and width Property

There are list of the jquery Dimensions.get window-Screen height and width size

  • .height()
  • .width()
  • .innerHeight()
  • .innerWidth()
  • .outerHeight()
  • .outerWidth()

jquery $(window).width() and $(window).height

var width = $(window).width(), height = $(window).height();
if ((width = 768)) 
{
	alert('Your screen width is'+width);
} 
else 
{
	alert('Do nothing error message');
}

Detect screen size with javascript

var windowWidth = window.innerWidth;
console.log(windowWidth);
var windowHeight = window.innerHeight;
console.log(windowHeight);

alert('Your screen width is: '+ windowWidth + ' and Your screen  height is:' + windowHeight);

Set width in percentage using jQuery

Using the width function:
$('div#menudiv').width('70%');

will turn:
<div id="menudiv" />

into:
<div id="menudiv" style="width: 70%" />

Screen innerWidth and innerHeight Property

var w = window.innerWidth;
console.log(w);
var h = window.innerHeight;
console.log(h);

get window screen width with Jquery

if ($(window).width() < 960) {
   alert('Your Screen Less than 960');
}
else {
   alert('Your Screen More than 960');
}

Full Example Of inner and outer width and height


<title></title>

<div id="result"></div>

var data = "";
data += "<p>Your Screeb innerWidth: " + window.innerWidth + "</p>";
data += "<p>Your Screeb innerHeight: " + window.innerHeight + "</p>";
data += "<p>Your Screeb outerWidth: " + window.outerWidth + "</p>";
data += "<p>Your Screeb outerHeight: " + window.outerHeight + "</p>";
document.getElementById("result").innerHTML = data;



Get DIV width and height in javascript

var width;

if (need == 1) {
   width = $("#web").width();
} else {
   width = $("#set").width();
}	

Development