O'Reilly logo

Web Design Blueprints by Benjamin LaGrone

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Loading the page functions

The first function, the body.onload function, will next call another function, called smoothScrollTo, as a property of the window, sending the value of the document body's scrollHeight property. At the bottom of the script, create that function, and it will make the page scroll smoothly through to the bottom of the full document body.

We will fill it out shortly, but first, we will finish the last line of this function. We will add an onscroll attribute to the body with the value calling a function called updateElement. The updateElement function is the most vital one for our parallax effect, so hang on and we'll write it shortly. Look at this code sample:

document.getElementById("body").onload = function(){ smoothScrollTo(document.body.scrollHeight); ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required