Scrollify Links
<p>I am trying to have links that scroll to the section. I don't understand why this isn't working, the links either don't work or they go to the section without scrolling at all. I am using the Scrollify plugin.</p>

<p>Javascript in the header. Should I put it in the footer? I read somewhere it should be in the header which I thought odd...</p>

<pre><code> $(function() {
            $.scrollify({
                section : ".section-class-name",
                sectionName : "first",
                easing: "easeOutExpo",
                scrollSpeed: 1100,
                offset : 0,
                scrollbars: true,
                standardScrollElements: "",
                setHeights: true,
                before:function() {},
                after:function() {},
                afterResize:function() {},
                afterRender:function() {}
            })
        });

        $(".first").click(function(e) {
          e.preventDefault();
          $.scrollify("move", $(this).attr("href"));
       });
</code></pre>

<p>The HTML</p>

<pre><code>     &lt;div class="section-class-name" data-name-section="first" style="background-color: red;"&gt;
            &lt;a href="#second" class="first"&gt;Second&lt;/a&gt;&lt;br&gt;
        &lt;/div&gt;
        &lt;div class="section-class-name" data-name-section="second" style="background-color: orange;"&gt;&lt;/div&gt;
        &lt;div class="section-class-name" data-name-section="last" style="background-color: yellow;"&gt;&lt;/div&gt;
</code></pre>