Lungo.js/examples/test/app/resources/sections/layout.html

<section id="layout" data-transition="slide">
    <header data-title="Layout" class="extended">
        <nav class="left button">
            <a href="#back" data-target="section" data-icon="home"></a>
        </nav>
        <nav class="right button">
            <a href="#" data-icon="user" data-label="button"></a>
        </nav>
    </header>

    <nav class="groupbar">
        <a href="#layout-art1" data-target="article" class="current" data-icon="home" data-label="aaa"></a>
        <a href="#layout-art2" data-target="article" data-icon="user" data-label="aaa"></a>
        <a href="#layout-art3" data-target="article" data-icon="user" data-label="aaa"></a>
        <a href="#layout-art4" data-target="article" data-icon="user" data-label="aaa"></a>
    </nav>

    <footer>
        <nav class="with-labels">
            <a href="#layout-art1" data-target="article" class="current" data-icon="home" data-label="aaa"></a>
            <a href="#layout-art2" data-target="article" data-icon="user" data-label="aaa"></a>
            <a href="#layout-art3" data-target="article" data-icon="user" data-label="aaa"></a>
            <a href="#layout-art4" data-target="article" data-icon="user" data-label="aaa"></a>
        </nav>
    </footer>

    <article id="layout-art1"></article>
    <article id="layout-art2"></article>
    <article id="layout-art3"></article>
    <article id="layout-art4"></article>
</section>