Categories
JavaScript Answers

How to make the browser wait to display the page until it’s fully loaded with JavaScript?

Spread the love

Sometimes, we want to make the browser wait to display the page until it’s fully loaded with JavaScript.

In this article, we’ll look at how to make the browser wait to display the page until it’s fully loaded with JavaScript.

How to make the browser wait to display the page until it’s fully loaded with JavaScript?

To make the browser wait to display the page until it’s fully loaded with JavaScript, we run our code in the window.onload method.

For instance, we write

body {
  opacity: 0;
}

to set the body element to have opacity 0 initially.

Then we write

window.onload = () => {
  setTimeout(() => {
    document.body.style.opacity = "100";
  }, 500);
};

to set window.onload to a function that calls setTimeout with a callback that sets the body’s opacity to 100 after 500 milliseconds.

Conclusion

To make the browser wait to display the page until it’s fully loaded with JavaScript, we run our code in the window.onload method.

Leave a Reply

Your email address will not be published.

If you like the content of this blog, subscribe to my email list to get exclusive articles not available to anyone else.