MarMan29
MarMan29

Reputation: 729

$(window).height() not working on resize

enter image description hereI'm trying to learn about window height and viewport. I made the following:

<html>
<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {

   for(var count=0; count < 100; count++) 
      $("body").append("<div><button class=\"hhh\">HELLO</button></div>");

});

$(document).on("click",".hhh",function(event) {
   console.log($(window).height());
   console.log($(window).scrollTop());
});

$(window).resize(function() {
       console.log($(window).height());  
});
    </script>

</head>
<body>
</body>
</html>

When I resize the window and click the button the $(window).height() always remains the same. I would have expected this value to change... Can anyone please tell me why it's remaining constant. I'm using the latest version of Chrome on a mac.

Upvotes: 1

Views: 890

Answers (2)

MarMan29
MarMan29

Reputation: 729

Ok this article explains things. I've never included a < !DOCTYPE HTML> on my html I guess this was a mistake...

http://viralpatel.net/blogs/jquery-window-height-incorrect/

Upvotes: 1

ProgrammerV5
ProgrammerV5

Reputation: 1962

Just give it a shot to this code:

$(window).resize(function() {
       console.log($(window).height());  
});

that works for me but I'm not sure if this is what you are looking for.

EDIT:

Could you please close the developer tools and include an alert in your code? You are getting back a different context for your height (you are getting the height for the debugger console not for the window). Try it and let us know if it doesn't work.

EDIT 2:

Just tried your exact same code compared to one of my test and the only difference I can see is that I have this at the top of my HTML document:

When I remove that from the document on Chrome I get the full height of the window (not zero) if I add it back I get the different sizes based on the resizing I do. What specific browser are you using? could it be that you are using an old browser?

Upvotes: 1

Related Questions