title: Horizontal slider using fullpage.js
body: <p>I tried to create a full page horizontal slider by using <a href="https://github.com/alvarotrigo/fullPage.js" rel="nofollow">fullpage.js</a> plugin. I use only one section with 3 slides.</p>
  
  <p>I tried to add a fixed navigation to slides in the top of page, so user can open the slides directly from the top navigation, but it doesn't work. Can anyone help me how to make it works?</p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;div id="header"&gt;
      &lt;a href="#" class="toSlide" data-index="1"&gt;Link to slide 1&lt;/a&gt;
      &lt;a href="#" class="toSlide" data-index="2"&gt;Link to slide 2&lt;/a&gt;
      &lt;a href="#" class="toSlide" data-index="3"&gt;Link to slide 3&lt;/a&gt;
  &lt;div&gt;
  &lt;div class="section" id="section0"&gt;
      &lt;div class="slide" data-anchor="slide1"&gt;
          &lt;h1&gt;Slide 1.js&lt;/h1&gt;
         This is slide 1
      &lt;/div&gt;
  
      &lt;div class="slide" data-anchor="slide2"&gt;
          &lt;h1&gt;Slide 2&lt;/h1&gt;
          this is slide 2
      &lt;/div&gt;
  
      &lt;div class="slide" data-anchor="slide3"&gt;
          &lt;h1&gt;Slide 3&lt;/h1&gt;
      &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>Javascript:</strong></p>
  
  <pre><code>$.fn.fullpage();
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>body{
      color: #fff;
  }
  h1{
      font-size:3em;
  }
  .section {
      text-align: center;
  }
  
  #section0{
      background: -webkit-gradient(linear, top left, bottom left, from(#4bbfc3), to(#7baabe));
      background: -webkit-linear-gradient(#4BBFC3, #7BAABE);
      background: linear-gradient(#4BBFC3,#7BAABE);
  }
  #header{
          position:fixed;
          height: 50px;
          display:block;
          width: 100%;
          background: #333;
          z-index:9;
          text-align:center;
          color: #f2f2f2;
          padding: 20px 0 0 0;
      }
  
      #header{
          top:0px;
      }
  </code></pre>
  
  <p>Here's the <a href="http://jsfiddle.net/7ksgn/" rel="nofollow">jsfiddle</a></p>
  
  <p>Thank you!</p>