We would move on to create more than one page of content. First, we modify the home page to become the following code, which adds a link to #page-2
. (Remember the ID in hrefs?)
<div data-role='page' id='root'>
<div data-role='header'>
<h1>Website Title</h1>
</div>
<div data-role='content'>
<p>Here is a paragraph that contains <a href='#page-2'>a link to page 2</a>. And content goes on here.</p>
</div>
</div>
Then we define a page 2 following the code above. Make sure the ID of the div matches the link in home page.
<div data-role='page' id='page-2'>
<div data-role='header'>
<h1>Page 2</h1>
</div>
<div data-role='content'>
<p>Page 2 content goes here. And it may contain link that link back to the <a href='#root'>first page</a>.</p>
</div>
</div>