Don't understand how to get orbit js working with Foundation 4

Question

I'm having trouble understanding the Foundation 4 JS docs sorry - if I use this:

$(document).foundation();

Every thing works great, but If I use this:

$(document).foundation('orbit', {bullets:false});

The bullets get removed from orbit but then none of the other javascript works (the responsive .toggle-topbar or the custom forms #customDropdown).

I've also tried this:

$(document)
  .foundation()
  .foundation('orbit', {bullets: false});

But then all the JS works but the bullets don't get removed.

I'm just not sure how it works sorry, any pointers in the right direction would be much appreciated.

Cheers

Ben

Answer 1

Your suggested answer @CMSCSS, while it works for you, is not accurate in general, especially this part:

if you initialize one plugin with options (eg Orbit) your have to initialize all the others you want to use or they won't run

The reason that custom styles or behaviors won't work or won't be applied is because of the order in which you initialize foundation and its components. To make everything work, your custom styles/behavior and foundation in general, you should do the customization first then initialize foundation. You can go to one of my answers and see how you can make it work. My answer was never accepted but it's a proven solution . I do it that way and it works. On a page I have an orbit, custom forms and grid layout and all work using the given technique. Hope that helps you.

Answer 2

So figured out that if you initialize one plugin with options (eg Orbit) your have to initialize all the others you want to use or they won't run like this:

$(document)
  .foundation('dropdown topbar forms')
  .foundation('orbit', {bullets: false});