materialize-css/jade/page-contents/pushpin_content.html

Builds Materialize distribution packages

<div class="container">
  <div class="row">

    <div class="col s12 m9 l10">

      <div id="introduction" class="section scrollspy">
        <h4>Introduction</h4>
        <p class="caption">Pushpin is our fixed positioning plugin. You can check out our live examples: the fixed Table of Contents on the right. </p>
      </div>



      <div id="initialization" class="section scrollspy">
        <h4>jQuery Plugin Initialization</h4>
        <pre><code class="language-javascript col s12">
  $(document).ready(function(){
    $('.tabs-wrapper .row').pushpin({ top: $('.tabs-wrapper').offset().top });
  });
        </code></pre>
      </div>



      <div id="options" class="section scrollspy">
        <h4>jQuery Plugin Options</h4>
        <table class="hoverable">
          <thead>
            <tr>
                <th>Option Name</th>
                <th>Description</th>
            </tr>
          </thead>

          <tbody>
            <tr>
              <td>Top</td>
              <td>The distance in pixels from the top of the page where the element becomes fixed. (Default: 0)</td>
            </tr>
            <tr>
              <td>Bottom</td>
              <td>The distance in pixels from the top of the page where the elements stops being fixed. (Default: Infinity)</td>
            </tr>
            <tr>
              <td>Offset</td>
              <td>The offset from the top the element will be fixed at. (Default: 0)</td>
            </tr>
          </tbody>
        </table>
      </div>

    </div>


    <!-- Table of Contents -->
    <div class="col hide-on-small-only m3 l2">
      <div class="toc-wrapper">
        <div class="buysellads hide-on-small-only">
          <!-- CarbonAds Zone Code -->
          <script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=materializecss" id="_carbonads_js"></script>
        </div>
        <div style="height: 1px;">
          <ul class="section table-of-contents">
            <li><a href="#introduction">Introduction</a></li>
            <li><a href="#initialization">Initialization</a></li>
            <li><a href="#options">Options</a></li>
          </ul>
        </div>
      </div>
    </div>

  </div>
</div>