zurb-foundation-5/doc/includes/orbit/examples_orbit_basic_rendered.html

Foundation 5 for npm (no code modification from original repo)

<div class="orbit-container">
  <ul data-orbit class="example-orbit orbit-slides-container">
    <li>
      <img src="{{assets}}/img/examples/satelite-orbit.jpg" alt="slide 1" />
      <div class="orbit-caption">
        Caption One.
      </div>
    </li>
    <li class="active">
      <img src="{{assets}}/img/examples/andromeda-orbit.jpg" alt="slide 1" />
      <div class="orbit-caption">
        Caption Two.
      </div>
    </li>
    <li>
      <img src="{{assets}}/img/examples/launch-orbit.jpg" alt="slide 1" />
      <div class="orbit-caption">
        Caption Three.
      </div>
    </li>
  </ul>

  <!-- Navigation Arrows -->
  <a href="#" class="orbit-prev">Prev <span></span></a>
  <a href="#" class="orbit-next">Next <span></span></a>

  <!-- Slide Numbers -->
  <div class="orbit-slide-number">
    <span>1</span> of <span>3</span>
  </div>

  <!-- Timer and Play/Pause Button -->
  <div class="orbit-timer">
    <span></span>
    <div class="orbit-progress"></div>
  </div>
</div>

<!-- Bullets -->
<ol class="orbit-bullets">
  <li data-orbit-slide-number="1"></li>
  <li data-orbit-slide-number="2" class="active"></li>
  <li data-orbit-slide-number="3"></li>
</ol>