Barra de navegación fija con sticky de Foundation

Con sticky de foundation podemos lograr que que la barra de navegación nos siga a cualquier parte donde naveguemos, quedándose fija en el sector que le indiquemos.
Primero creamos un section que contendrá todo el código del menú, a este section contenedor le pondremos el atributo data-sticky-container.
Luego dentro de este section contenedor , volvemos a crear otro segundo contenedor, este sera un div y contendrá el resto del codigo del menu fijo, a este div le ponemos la clase data-sticky y el atributo data sticky .
A este segundo div le podemos agregar otros atributos, como por ejemplo un atributo que indique cuanto margen deberá dejar de margen superior, esto lo indicamos con este atributo data-options=“marginTop:0;” en este ejemplo le agregamso un margin top de cero.
Otro atributo que le podemos agregar a este segundo div, es desde que tamaño de la pantalla queremos que se empiece a activar sticky, pondremos que desde tamaño small, lo ponemos así **data-sticky-on=“small” **
Y por ultimo, falta un atributo , que es para indicar a que elemento se tiene que pegar, este atributo recibe como valor el id del elemento al cual se tiene que pegar, este atributo se llama data-top-anchor="—" como buena practica es recomendable pasarle como valor el id del section que contendrá todo el menú, el mismo section que tenia el atributo data-sticky-container.

 <section id="st" data-sticky-container>
      <div class="data-sticky" data-sticky data-options="marginTop:0;" data-sticky-on="small" data-top-anchor="st">
          <nav id="menu-container" class="title-bar" data-magellan data-bar-offset="29">
                  <ul class="dropdown menu align-spaced show-for-medium" data-dropdown-menu>
                    <li> <a href="#compraboletos">Tickets</a></li>
                    <li> <a href="#lineup-nav">Lineup</a>
                        <ul id="submenu-container" class="menu">
                            <li><a href="#lineup-nav" data-toggle-dia="panelViernes">Viernes</a></li>
                            <li><a href="#lineup-nav" data-toggle-dia="panelSabado">Sábado</a></li>
                           <li><a href="#lineup-nav" data-toggle-dia="panelDomingo">Domingo</a></li>
                        </ul>
                    </li>
                    <li> <a href="#info-container">Info</a></li>
                    <li> <a href="#suscribete">Suscribete</a></li>
                   </ul>
          </nav>
      </div>
    </section>```