anchor.diff:      <%- end -%>
     </div>
   
  -  <p>
  -    <button class="button" id="oslide-5--previous">Previous slide</button>
  -    <button class="button" id="oslide-5--next">Next slide</button>
  -  </p>
  +  <%- content_for :custom_nav do -%>
  +<p>
  +  <button class="button" id="oslide-5--previous">Previous slide</button>
  +  <button class="button" id="oslide-5--next">Next slide</button>
  +</p>
  +<script>
  +  $(document).on("ornament:refresh", function(){
  +    $(".oslide-5").oslide({
  +      itemWidth: 190,
  +      showNavigation: false
  +    });
  +    $("#oslide-5--next").on("click", function(){
  +      $(".oslide-5").trigger("oslide:next");
  +    });
  +    $("#oslide-5--previous").on("click", function(){
  +      $(".oslide-5").trigger("oslide:previous");
  +    });
  +  });
  +</script>
  +  <%- end -%>
  +  <%= yield :custom_nav -%>
  +  <pre class="sg-pre prettyprint"><%= render_source(yield :custom_nav) -%></pre>
   
     <h2 class="heading-two">Marking up your Object Slider</h2>
   
  
positive.code:     <%- end -%>
    </div>
  
    <h2 class="heading-two">SlideBy 1 at a time</h2>
  
    <div class="oslide oslide-3" data-oslide>
      <%- (1..10).each do |i| -%>
        <div class="slide content-spacing" data-slide>
          <p>
            <img src="http://placehold.it/180x120" />
          </p>
          <h3 class="heading-four"><a href="#">Item <%= i -%></a></h3>
        </div>
      <%- end -%>
    </div>
  
    <h2 class="heading-two">Minimap</h2>
  
  
negative.code:   afterNextSlide          : null
  });</pre>
  
  </div>