42 lines
1.2 KiB
HTML
42 lines
1.2 KiB
HTML
<br />
|
|
View the source of this demo <a href="https://github.com/cmpolis/Pagify/tree/master/demo">here</a>. Or...
|
|
|
|
<h3>Create a <em>container</em> page:</h3>
|
|
|
|
<p>Load Pagify and jQuery:</p>
|
|
|
|
<pre><script src="jquery.min.js" type="text/javascript"></script>
|
|
<script src="pagify.js" type="text/javascript"></script>
|
|
</pre>
|
|
|
|
<p>Create a div that will contain page content:</p>
|
|
|
|
<pre><div id='page_holder' /></pre>
|
|
|
|
<p>Call <strong>pagify</strong> on the aforementioned div and pass in options. <em>The only required option is <code>pages</code>.</em></p>
|
|
|
|
<pre>$('#page_holder').pagify({
|
|
pages: ['home', 'about', 'contact'],
|
|
default: 'home' // The name of a page or null for an empty div
|
|
});
|
|
</pre>
|
|
|
|
|
|
<p>Link to other pages by linking to hashes of their page names:</p>
|
|
|
|
<pre><a href='#contact'>Contact</a>
|
|
<a href='#about'>About</a>
|
|
...
|
|
</pre>
|
|
|
|
|
|
<h3>Write other pages</h3>
|
|
|
|
<p>Create content pages in the same directory as the container as <code>[page_name].html</code></p>
|
|
|
|
<p><em>i.e. about.html</em></p>
|
|
|
|
<pre><h1>About us</h1>
|
|
<p>This is an about page!</p>
|
|
</pre>
|