View demo here
In this project, you'll enhance the usability of a web page that has too much information. To make it easier to find information and read the page, you'll use progressive enhancement to add pagination. The page includes a list of 54 students. You need to add programming to display 10 students per page, and add buttons to jump between the lists of 10 students. Your solution should work for any number of student listings, whether there were 5, 25, 55 or 100 student listings.
- No inline JavaScript. All JS is linked from an external file.
- Uses unobtrusive JavaScript to append markup for the pagination links. So none of the pagination link's markup is added into the HTML.
- Pagination links are created. If there are 44 students, 5 links should be generated, if there’s 66 students, 7 links should be generated.
- The first 10 students are shown when the page loads, and each pagination link displays the correct students. Clicking on “1” in the pagination links should show students 1 to 10. Clicking “2” shows 11 to 20. Clicking “5” shows students 41 to 50, and so on.
- Code comments have been added explaining how the functions work.
These instructions will get you a copy of the project up and running on your local machine for development
Click on the 'Clone or download' button and select 'Download Zip.'
Step 1: Unzip the zip file.
Step 2: Open the folder in a text editor.
Using a text editor, you can view/edit the code or preview the app in a browser.