Tutorial Webpage for

Lecture Cloud- and Web-Technologies


JQuery/AJAX - Page-wise CV

This time we want to have a page-wise version of our duck CV: There are four buttons on the sidebar with which the user can choose a page of the duck CV. After pressing on one of the buttons, the old page is faded out, the new page is loaded from the server and faded in. You can render the solution for an example how it could look like.
You can access the server under the url page.php. The server requires a parameter page set to 1, 2, 3 or 4. The server returns the html code for the different pages. For any invalid input, the server returns the string Server: invalid input!.
Furthermore, the buttons for active pages should be disabled.


Please use the following editor for your exercise. You can run the content of the editor by clicking on the tab 'Run'...

Output of Editor Content

The result of running the editor content is as follows:

Output of the Solution

The output of the solution is as follows:


Please have a look at the solution only after you have finished working on your own solution. Otherwise the learn effect is much less.