orbit slider - remove progress bar from orbit slider

2
votes

How can I remove or turn off the timer progress bar of the orbit slider?

Looked at all the custom settings but don't see anything that would do that.

2
slideshowzurb-foundationprogressorbit
I believe the "correct" way to do this is to set $orbit-timer-show-progress-bar to false in the SCSS settings. Unfortunately, I can't get this to have any effect. (hence not posting it as an answer). - Nateowami

2 Answers

2
votes

Add the following to your stylesheet:

.orbit-timer { display:none;}

It will completely hide the progress bar, it will just be on a continuous loop.

0
votes

Inside the HTML file: 

<ul data-orbit data-options="timer:false;">
  <li>...</li>
  <li>...</li>
</ul>

or inside the JS file:

$(document).foundation({
  orbit: {
    timer: false
  }
});

If you use Foundation 5, see the docs here, and in case of Foundation 4 here. You can find the instructions about the JS-settings of Orbit at the end of the mentioned docs pages.