How to get the 'height' of the screen using jquery

JavascriptJquery

Javascript Problem Overview


I want to set something in the middle of the screen

thanks

Javascript Solutions


Solution 1 - Javascript

$(window).height();   // returns height of browser viewport
$(document).height(); // returns height of HTML document

As documented here: http://api.jquery.com/height/

Solution 2 - Javascript

use with responsive website (view in mobile or ipad)

jQuery(window).height();   // return height of browser viewport
jQuery(window).width();    // return width of browser viewport

rarely use

jQuery(document).height(); // return height of HTML document
jQuery(document).width();  // return width of HTML document

Solution 3 - Javascript

$(window).height();

To set anything in the middle you can use CSS.

<style>
#divCentre 
{ 
    position: absolute;
    left: 50%;
    top: 50%;
    width: 300px;
    height: 400px;
    margin-left: -150px;
    margin-top: -200px;
}
</style>
<div id="divCentre">I am at the centre</div>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionzjm1126View Question on Stackoverflow
Solution 1 - JavascriptDustin LaineView Answer on Stackoverflow
Solution 2 - JavascriptPiseth SokView Answer on Stackoverflow
Solution 3 - JavascriptrahulView Answer on Stackoverflow