IE8 JavaScript issue

Question

I need to have a bottom bg at the bottom of the page all the time, so I came up with a decision to get window height and main content height and calculate if the bottom part should be pushed down or not. The problem came up when the content block was too short and the computer screen was much bigger, so the bottom bg was right at the end of the the content and had nothing after till the end of the bottom screen. Hopefully it makes sense ) I decided to add some height inside of the content to make it longer so it fills up the bottom space and very bottom gap disappear.

Here is the JavaScript I used to fix it:

window.onload=function(){
    var winHeight = window.innerHeight;
    var fixIt = winHeight - 200;
    var divHeight = document.getElementById('bottomDiv').clientHeight;
    alert(winHeight - divHeight);
    if (divHeight < winHeight) {
        var fire = document.getElementById('innerDiv').style.height = fixIt + "px";
    }
};

Problem: this script works fine and does its job well in all browsers but not IE7-IE8. Can you please help to get a solution for old IE browsers?

Thanks, Art

window.innerHeight ie8 alternative

Roland Jansen
– Roland Jansen

2013-08-01 18:44:32 +00:00
Commented Aug 1, 2013 at 18:44 — Roland Jansen
– Roland Jansen, Commented Aug 1, 2013 at 18:44
Why can't you do it in css?

Frederik.L
– Frederik.L

2013-08-01 19:19:03 +00:00
Commented Aug 1, 2013 at 19:19 — Frederik.L
– Frederik.L, Commented Aug 1, 2013 at 19:19

user2437417 · Accepted Answer · 2013-08-01 18:47:18Z

3

window.onload=function(){
    //                                 v---------------------------------------v
    var winHeight = window.innerHeight || document.documentElement.clientHeight;
    var fixIt = winHeight - 200;
    var divHeight = document.getElementById('bottomDiv').clientHeight;
    alert(winHeight - divHeight);
    if (divHeight < winHeight) {
        var fire = document.getElementById('innerDiv').style.height = fixIt + "px";
    }
};

answered Aug 1, 2013 at 18:47

community wiki

user2437417

Sign up to request clarification or add additional context in comments.

2 Comments

Art Over a year ago

Thanks a lot. Worked well. All fixed!

Samer Over a year ago

Mark it as answered if that's the one :)

Community · Accepted Answer · 2017-05-23 10:25:25Z

1

Maybe instead you could apply your "bottom" background to the html element, then cover it up with a different background (possibly in your div#content) in the upper region.

Otherwise, it seems innerHeight isn't supported in IE8.

window.innerHeight ie8 alternative

Try

var winHeight = document.documentElement.clientHeight

edited May 23, 2017 at 10:25

CommunityBot

11 silver badge

answered Aug 1, 2013 at 18:50

Jackson Ray Hamilton

9,5766 gold badges54 silver badges81 bronze badges

Collectives™ on Stack Overflow

IE8 JavaScript issue

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related