0

I am looking at this plugin to be used as part of my Bootstrap 3 project, i.e.:

slidebars

but being new to Bootstrap, I am unsure on how to expand on this left slideout menu so that it will also cater for child list items/records as at the moment, this plugin only represents top level menu items.

How can I add 5 sub-menu items to the top level API menu option?

Please note also that I am looking at dynamically creating my menu items based off an Oracle database table and used within Oracle APEX.

I will also require some form of indicator at the parent level, to depict that a child menu options exist.

NOTE: I need this to work with IE8 browser.

The current usage code is as follows:

<div class="sb-slidebar sb-left sb-active">
    <nav>
        <ul class="sb-menu">
            <li><img src="http://plugins.adchsm.me/slidebars/images/slidebars-logo-white@2x.png" alt="Slidebars" width="118" height="40"></li>
            <li class="sb-close"><a href="http://plugins.adchsm.me/slidebars/">Home</a></li>
            <li class="sb-close"><a href="http://plugins.adchsm.me/slidebars/index.php#download">Download</a></li>
            <li class="sb-close"><a href="http://plugins.adchsm.me/slidebars/usage.php">Usage</a></li>
            <li class="sb-close"><a href="http://plugins.adchsm.me/slidebars/usage.php#api">API</a></li>
            <li class="sb-close"><a href="http://plugins.adchsm.me/slidebars/compatibility.php">Compatibility</a></li>
            <li class="sb-close"><a href="http://plugins.adchsm.me/slidebars/issues.php">Issues</a></li>
            <li class="sb-close"><a href="http://plugins.adchsm.me/slidebars/contact.php">Contact</a></li>
            <li class="sb-close"><a class="github" href="https://github.com/adchsm/Slidebars">Github</a></li>
            <li class="sb-close"><span class="sb-open-right">About the Author</span></li>
            <li class="sb-close"><small>Slidebars © 2014 Adam Smith</small></li>
        </ul>
    </nav>
</div> 
halfer
  • 19,824
  • 17
  • 99
  • 186
tonyf
  • 34,479
  • 49
  • 157
  • 246
  • http://jasny.github.io/bootstrap/components/ Doing something like this where it drops "down" should work well. – Aibrean Nov 20 '14 at 17:52
  • @Aibrean - this looks like what I am after, especially the off canvas component. The only thing is, I need to incorporate the default navmenu as an off canvas look and field, so user can show/hide menu but it looks like it doesn't work within IE8 - it's all over the place. – tonyf Nov 21 '14 at 00:48
  • Are you using Respond and modernizr? – Aibrean Nov 21 '14 at 13:37
  • @Aibrean - I haven't as yet incorporated jasny off canvas component into my site but simply tried the examples from jasny website using IE8. Based on this, does the jasny website itself use Respond and Modenizr? – tonyf Nov 21 '14 at 14:21
  • What IE version are you using to test IE8 in? I am not sure if Jasny is using respond properly since Bootstrap CSS is being called in with a CDN and Respond requires a proxy for that to work. – Aibrean Nov 21 '14 at 16:48
  • Hi, have managed to get the Off Canvas Reveal Menu Template working in IE8 but what I have found that when you start shrinking the screen to iPhone size (happens in IE8, Chrome as well) and then press the toggle button, both the toggle button and actual canvas areas appear below the nav menu - unsure if this is a media query that is being missed or something else? Any ideas anyone? ps: use example to test this issue: http://jasny.github.io/bootstrap/examples/navmenu-reveal/# – tonyf Dec 10 '14 at 02:50

0 Answers0