Menu icon Foundation
Why won't Joyride work?

I'm having some trouble getting joyride to work however from what I've checked everything is in order and it should be working. I have attached code so you can see. I have no idea why this isn't working but nothing comes up at all.

<ol class="joyride-list" data-joyride>
  <li data-id="firstStop" data-text="Next">
    <p>Test</p>
  </li>
  <li data-id="secondStop" data-text="Next">
    <p>Test</p>
  </li>
  <li data-id="thirdStop">
    <p>Test</p>
  </li>	 
</ol>
            

         

<div class="row">
  <div class="large-12 columns">
    <ul>
      <li><h2 id="firstStop" class="panel">First</h2></li>
	  <li><h2 id="secondStop" class="panel">Second</h2></li>
	  <li><h2 id="thirdStop"class="panel">Third</h2></li>  
	</ul>
  </div>
</div>
         

joyrideinitialisenot workingproblemerrorFoundation 5

I'm having some trouble getting joyride to work however from what I've checked everything is in order and it should be working. I have attached code so you can see. I have no idea why this isn't working but nothing comes up at all.

<ol class="joyride-list" data-joyride>
  <li data-id="firstStop" data-text="Next">
    <p>Test</p>
  </li>
  <li data-id="secondStop" data-text="Next">
    <p>Test</p>
  </li>
  <li data-id="thirdStop">
    <p>Test</p>
  </li>	 
</ol>
            

         

<div class="row">
  <div class="large-12 columns">
    <ul>
      <li><h2 id="firstStop" class="panel">First</h2></li>
	  <li><h2 id="secondStop" class="panel">Second</h2></li>
	  <li><h2 id="thirdStop"class="panel">Third</h2></li>  
	</ul>
  </div>
</div>
         
Allan Kendall over 5 years ago

After much digging to no avail I stumbled upon this in the code behind of the documentation that Zurb have for Joy ride.

 $(document).foundation().foundation('joyride', 'start');

This fixed the problem. This is pretty crucial you'd think they would mention that you need to write this geeeeso