Open the
layout.jsfile from the js folder, as shown in the following screenshot:
You should see the following code:
Below the comment (denoted by //), adjust the section. On line 5, add the following code to let the sections fit into the viewport:
$('.full-h').css({ height: win.height() });Refresh the site in your browser, and you should now see that the sections fit into the document window, as shown in the following screenshot:
Even though the site loads perfectly well and the sections fit well into the viewport, just as the site loads you see the sections on the page for a brief moment, as shown in the following screenshot:
So what happened here? It's quite simple. The jQuery CDN and layout.js files are placed just before the closing </body> tag. While the DOM is being rendered, the JavaScript is still downloading and executes a brief moment after the DOM has been parsed. This is a very small example of a project with hardly any...