anchor.diff:    stickyClass : 'sticky',
     custom_back_text: true, // Set this to false and it will pull the top level link name as the back text
     back_text: 'Back', // Define what you want your custom back text to be if custom_back_text: true
  +  is_hover: true,
  +  scrolltop : true, // jump to top when sticky nav menu toggle is clicked
     init : false
   }", :js %>
         </div>
  
positive.code:         <h1><%= @page_title %></h1>
          <h4 class="subheader">The Foundation Top Bar gives you a great way to display a complex navigation bar on small or large screens.</h4>
  
          <nav class="top-bar" data-topbar="hover">
            <ul class="title-area">
              <!-- Title Area -->
              <li class="name">
  
negative.code:       <div class="large-12 columns">
  
          <h3>Build With HTML Classes</h3>
          <p>The top bar is a pretty complex piece of magical UI goodness, which makes it really difficult to create a mixin from it. We rely on many presentational classes to accomplish the styles and there's a lot happening in the JS. The top bar is hoverable by default but can be changed to a click event by adding a simple <code>data-option="is_hover:false"</code> to the <code>&lt;nav&gt;</code> element. <a href="#clickable">See an example below</a>.</p>
  
          <h5>Basic Needs</h5>
          <p>The top bar has four main elements, three of which are needed for proper functionality: <code>ul.title-area</code>, a <code>ul class="right/left</code> element enclosed in a <code>section class="top-bar-section"</code>, and the <code>li.toggle-topbar</code> element that will expand the menu in the mobile layout. You can leave out the li class="name" as long as you include the .toggle-topbar element.</p>
  