Preparing the underlying page
In this task we'll set up the files that we're going to use throughout this project and prepare the underlying page that our infinite scroller will reside on.
Prepare for Lift Off
As usual we'll be using a custom style sheet for this project and a custom script file, so let's add them first. Create a new JavaScript file called infinite-scroller.js
and save it in the js
directory. Then create a new style sheet called infinite-scoller.css
and save it in the css
directory. Lastly, save a copy of the template.html
file in the root project folder and call it infinite-scroller.html
.
Engage Thrusters
The underlying markup used by the example page will be minimal – a lot of the elements that we'll be working with will be generated dynamically by our template, which we can also add in this task.
First of all we should add references to our new files to the HTML page. Start by adding a <link>
element for the style sheet to the <head>
of infinite-scroller.html
,...