Skip to content

Instantly share code, notes, and snippets.

@jackmcdade
Created March 19, 2012 21:50
Show Gist options
  • Select an option

  • Save jackmcdade/2127399 to your computer and use it in GitHub Desktop.

Select an option

Save jackmcdade/2127399 to your computer and use it in GitHub Desktop.
Twitter Bootstrap2 with Structure
{exp:structure:nav max_depth="2" show_depth="2" current_class="active" css_class="nav" has_children_class="dropdown"}
<script>
$(function() {
$('ul li.dropdown').each(function() {
$(this).children('ul').addClass("dropdown-menu"); // add children dropdown menu class
$(this).children('a').append('<b class="caret"></b>') // add caret icon
$(this).clone().prependTo($(this).find('ul')).removeClass('dropdown active').children('ul').remove(); // clone parent link into child menu
$(this).children('a').attr('data-toggle', 'dropdown').attr('href', '#').addClass("dropdown-toggle"); // add data attributes to hook up Bootstrap
});
});
</script>
@allanwhite
Copy link
Copy Markdown

Seems to work. Comments:

  1. <script> should have type="text/javascript", right?
  2. I put the script in the foot of the document inside a document.ready() statement, then it worked.
  3. Nav items with third-level items in them show a disclosure triangle but no visible items.

@jackmcdade
Copy link
Copy Markdown
Author

jackmcdade commented Mar 19, 2012 via email

@interfacecreation
Copy link
Copy Markdown

What other js files are you calling, cant get it to work.

I call the jquery and bootstrap.min.js before, no firebug errors on the page.

@jackmcdade
Copy link
Copy Markdown
Author

Make sure you use at least jQuery 1.7.1, and set the has_children class.

@interfacecreation
Copy link
Copy Markdown

Sweet, all good after upgrading to Structure 3.2. Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment