Link between pages

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>

Next Page → Page transition

← Previous Page One page web application


Last updated at 2017-05-10. Show version history

Comments

no comments yet.