JavaScript not functioning properly on Internet Explorer version 8

I have a javascript function on my website that is triggered onLoad in the body:

function adjustDivSize()
{   
    d = document.getElementById('background');   
    document.getElementById("backgroundImg").style.height = window.innerHeight+"px";
    imgWidth = document.getElementById("backgroundImg").width;
    marginLeft = ($(window).width() - imgWidth)/2;   
    d.style.width = imgWidth+"px";
    d.style.left = marginLeft+"px";
    document.getElementById("backgroundImg").style.visibility="visible";
    document.getElementById("menu").style.visibility="visible";
}

This function sets the height of an element to match the browser page height. It works well in most browsers, except for IE7 and IE8 where it doesn't load properly. Do you have any suggestions for a solution?

Thank you

Answer â„–1

window.innerHeight may not be compatible with older versions of Internet Explorer, such as IE8 and below. Consider using document.body.clientHeight instead.

Update: Hold on a second... are you implementing jQuery in line 6?:

marginLeft = ($(window).width() - imgWidth)/2;

If you are, then opt for $(window).height() to retrieve the height value.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Omit the checkbox for children when clicking

I am encountering a problem with the following HTML code: <tr class="clickable" onclick="location.href='https://www.w3schools.com'"> <td> Lore ipsum </td> <td>More content</td> <td>< ...

Looking to implement an automatic refresh for the seconds in my Node.js application

Currently in the process of developing a web application that displays the local time of a specified timezone. I am utilizing a timezone API and seeking a method to automatically refresh the page or call the API every second in order to update the seconds ...

How can you implement styling using the DOM in ReactJS and a server-side framework?

I'm new to reactjs and looking to directly manipulate styles with DOM or inline-styles. I've been using useLayoutEffect to ensure this happens early in the process. import { useLayoutEffect } from 'react' const App = () => { us ...

The Ajax request returned an error message indicating that the method "Get"

I'm attempting to utilize ajax with the POST method, but I keep encountering this specific error message: An effort was made to execute the \u0027SendEmail\u0027 method using a GET request, which is not permitted Below is the JavaScript ...

What is the process for creating an HTML file that can automatically save?

I am looking to develop a unique HTML document where users can enter text in text fields, save the file by clicking a button, and ensure that their changes are not lost. It's like what wysiwyg does for HTML documents, but I need it to be integrated di ...

The combination of jQuery and JavaScript targeting the element with the ID '#update1' is essential. Can someone please assist me with

comprehend my message <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"> ...

Setting the values of a string array to the properties of an object dynamically in TypeScript

Imagine a situation where a component called searchBox is given two inputs: @Input() titles: string[] and @Input() model: Object. The number of values in the titles array matches the number of properties in the model object. The searchBox component generat ...

Retrieve the CSS class definition using the console in the Chrome Developer Tools

Is there a way to automatedly extract CSS class definitions from Chrome Developer Tools? I want to retrieve the styles defined in a specific class name, similar to how it is displayed in the Styles tab on the right-hand side. I know about the getComputedS ...

What is the process for assigning variables to modules using RequireJS?

Is there a way to define variables for modules in RequireJS? In simpler terms, how can I achieve the equivalent of the following using RequireJS: var fs = require('fs'); var child_process = require('child_process'); I am looking to s ...

Troubleshooting: Why is Spring MVC failing to return results on ajax call?

I am trying to retrieve user data through an ajax request, but I am facing an issue where the success part of the request is not being reached and no logs are being generated. This is the controller code: @Controller @RequestMapping(value = "/api/profile ...

What is the best way to incorporate Javascript into jQuery tabs?

On my website, I have implemented a Jquery and CSS tab system similar to the one found here. Each tab contains a Facebook feed box, a Twitter widget, and a ranking widget for my blog. However, when these widgets are placed within the tab content area, they ...

Submit form data to an iframe and display the output text on the main page

My website features a form that posts to an iframe within the same parent page, sharing the domain and other attributes. <iframe id="ifc1" style="display:none;" name="ifc"></iframe> <div id="couponbox"> <form enctype="multipart/form- ...

Run an anonymous function when the page is loaded

When it comes to loading a JavaScript function upon page load, there are various methods such as onLoad(), $( document ).ready(), and more. However, I am facing an issue with a function that does not have a specific name. This unnamed function is used to ...

Adding a preloaded picture multiple times in a loop

window.preloadShips = function(){ window.shipImages.omega = new Image(); window.shipImages.omega.src = "shipIcons/omega.png"; } // After a while for (var i = 0; i < this.primary.systems.length; i++){ var td = document.createElement("td ...

Clearing input fields within a Modal Popup using AngularJS and Bootstrap

I have a button on my webpage that triggers a modal dialog with a text field. The issue I am facing is that even after entering text into the field and closing the modal, the content remains when I reopen it. I want the text field to be empty every time I ...

Is it possible to derive the language code without using the Common Locale Data Repository from a rough Unicode text

I am currently developing a dictionary application. One of the features I am working on involves identifying the language of a Unicode character when entered by a user. For example: 字 - would return ['zh', 'ja', 'ko'] ا٠...

Input specific ng-if conditions

I'm a bit confused about the conditions for my ng-if and could use some assistance. I have a form on my page that is rendered using ng-repeat and a couple of custom filters. You can check out this plunker. The issue I'm facing is that I need to p ...

Steps for adding a thought bubble over an image using CSS

Currently, I am working on a project where users can upload an image and based on that image, a thought bubble or speech bubble is placed on top. I need to make sure the placement is just right, but my main priority is getting a functional version up and ...

Is there a way to execute a function both upon page load and after a click event?

Greetings! I am completely new to using jQuery in any of my projects and could use some assistance. On one of my web pages, I have implemented code to load menu details from a JSON file. These details include the name, action, and poster for the main menu ...

`Multiple Autocomplete feature that allows rendering of previously selected items`

I've encountered a slight issue with my autocomplete feature. On the same page, I have two different autocompletes set up. Both of them pull elements via ajax from separate sources and use the _render option to display the items. The problem arises wi ...