Hello guys, i need help!
Where do i add the content of the main body?
Kay Org () - 7 years ago - Reply -4
How do i copy this code? The copy is not working.
. https://analysisdoctors.blogspot.com/
Ikemerit () - 4 years ago - Reply 0
How do i copy this code? The copy is not working.
. https://analysisdoctors.blogspot.com/
Ikemerit () - 4 years ago - Reply 0
Hy!
A question: when i click one of the sub-menu, and that opened a new page, how can i collapsed out the active menu?I want to show, which sub-menu is opened.
Sorry my low-level english.
Thx!
MrGreko () - 8 years ago - Reply 0
Can someone provide the list of scripts and css that are required?
I'm trying bootstrap.min.css, bootstrap.min.js , font-awesome.min.css, and jquery-3.1.1.js.
It's failing to work and I also included the css in the tab here
Arren () - 8 years ago - Reply 0
CSS(in <head>)
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
JS(before closing </body>)
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
CatWoman817 (-1) - 5 years ago - Reply -1
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/boo...">
<script src="//maxcdn.bootstrapcdn.com/boo..."></script>
<script src="https://ajax.googleapis.com..."></script>
Hebert Marin () - 8 years ago - Reply 0
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn...">
<script src="https://ajax.googleapis.com..."></script>
<script src="https://maxcdn.bootstrapcdn..."></script>
Ranish Weerakkody () - 7 years ago - Reply 0
After two days,....
Menu roll down correctly, but after that, stay open, can be rolled up with click. Also, in toggle mode, toggle button and whole menu are visible. Any suggestion?
Svetionicar () - 8 years ago - Reply 0
how to put it into page, content only visible in mobile view not in desktop view
Sonu Singh () - 8 years ago - Reply 0
I need replacement for CDN. Also how can i change the background colors of menu bars??
naveen () - 8 years ago - Reply 0
In small screen devices it is collapsing properly but after opening once I am unable to close it again.In short Toggle is not working properly,. Some one please help me out
Syed Sajid () - 9 years ago - Reply 0
done integrating it to my page but it does not collapse back in to compressed default after clicking it.
Eric James P Belleca () - 9 years ago - Reply 0
mine doesnt collapse back in... what could have i done wrong?
Eric James P Belleca () - 9 years ago - Reply 0
hi, ow can i put a third level? i mean, sub menu within a submenu
thanks.
Pedro Gonzalez Reveco () - 9 years ago - Reply 0
thanks , That menu is beautiful, how can i prevent an item to expand when another items are expanded .. ?
Basim () - 9 years ago - Reply 0
If you cant add main content to the right try this:
<div class="container-fluid>
<div class="row">
< !-- this is the sidebar -->
<div class="nav<div class="nav-side-menu col-md-2">; ... </div>
<div class="col-lg-offset-2 col-lg-8"> ... </div>
</div>
</div>
peace
Diego Estela () - 9 years ago - Reply 0
That menu is beautiful, but how can I make add some container with rows and columns?
It's over the menu. Plaese I need some advide.
Raflindas () - 9 years ago - Reply 0
Hello, I am facing the same problem. It does not work for my bootstrap.js. Because the links are open before and the Toggle menu does not close after I open. If you can help me, I am grateful.
Hiury () - 9 years ago - Reply 0
Put the JS bootstrap at the end document. It works. Functional and beautiful menu. Thank you!!!
Michelle () - 9 years ago - Reply 0
Hello, I really like this Menu, but I'm new on bootstrap and i'm having problems, the main content that its in <div class="container body-content"> shows behind the menu, I managed to fix this by modifying the padding on body-content class, but then when I resize, before it dissapears, the main content goes behind the menu again. Is there anyway to not get this or get a scrollbar or something ike that? thanks
Krash () - 9 years ago - Reply 0
I had a Problem collapse not working and I'm also using Bootstrap version 3.2.0 . Please Help me .
Thanks in Advance
Kamran Karim Bukhsh () - 9 years ago - Reply 0
You need jQuery and Bootstrap JS to be used before you try to use this code too :)
maxsurguy () - 9 years ago - Reply 0
hey brother i have used both as well ok. Its not working :)
Please help if you can
Kamran Karim Bukhsh () - 9 years ago - Reply 0
It is blank first but when we re size to mobile and collapse the menu then it gets visible
Mohammad Faizan Atiq () - 9 years ago - Reply 0
Replace <ul id="menu-content" class="menu-content collapse out">
with
<ul id="menu-content" class="menu-content collapse in">
Mohammad Faizan Atiq () - 9 years ago - Reply 0
anyone have the issue of bootstrap.css covering up the main body of the nav?
ee () - 9 years ago - Reply 0
support for multilevel submenu?, how to show if there is a submenu in the submenu?
cyberchezee () - 9 years ago - Reply 0
That's what i wanted.
Thanks for saving me from coding it from scratch.
Thanks Again
Tanmay () - 9 years ago - Reply 0
Simple and beautiful. Thank you very much, this is just what I was looking for.
However, the markup is invalid: the UL elements which contain the submenus are children of another UL element.
But this was very easy to solve, I just wrapped the submenus UL elements inside their ancestor LI. It worked perfectly, and gives a nice effect too when a submenu is expanded IMO.
Leda Ferreira () - 10 years ago - Reply 0
how to set, left side(side bar) and right side(main contents).
i used
" <div class="col-md-2"> {side bar} <div>
<div class="col-md-10"></div> ", but layout is so bad.
help me, please.
min () - 10 years ago - Reply 0
For content try use container
<div class="container">Your Content</div>
and add a csss
.container {
margin-left:300px;
}
DT () - 10 years ago - Reply 0
Hey there,
Is this compatible with 3.3.1? It's not working for me, the only thing I can see if the Brand Logo part but everything below is not visible (the buttons etc). Can you make a simpler version of this, or so?
Thanks and great job, I love it. Wish I could use it!
FPJ () - 10 years ago - Reply 0
add css in this class its working for me
.nav-side-menu .menu-list .menu-content{
visibility:visible !important;
}
Muthu Kumar () - 10 years ago - Reply 0
The issues as discuss below are solved find the updated snippet thanks!
Ishwar () - 10 years ago - Reply 0
Hey thanks for updating the issue . But for query which I made . can it be made an accordion menu ? the css transitions looks nice when only one menu is open at a time ? can it be possible ?
Joy () - 10 years ago - Reply 0
I think what you want to do can be achieved through this jquery code at the bottom of your page:
$(document).ready(function(){
$(".collapsed").click(function(){
$("#products, #service, #new").collapse('hide');
});
});
At least it's working for me.
Alexandros Karras () - 9 years ago - Reply 0
ya thats possible for that u have to config jquery script provided by bootstrap will update it soon
Ishwar () - 10 years ago - Reply 0
shouldn't this have been more elegant if accordion concept was used ? I mean only one menu at a time should have been open rathar than all can be expanded ? That wont leave us with a problem that last menu item is not displayed when all items are expanded
Joy () - 10 years ago - Reply 0
When all the menu items are expanded , the last menu item is not displayed properly
emilrichard () - 10 years ago - Reply 0
I had the same problem, this is how I solved it. Adjust the values (92% and 50px) the way it suits you better.
height: 92%; /* browsers without calc() support */
height: -moz-calc(100% - 50px);
height: -webkit-calc(100% - 50px);
height: calc(100% - 50px);
Leda Ferreira () - 10 years ago - Reply 0
Hey, where is the javascript?
it doesnt work for me with only use bootstrap.js
Guest () - 10 years ago - Reply 0
There is no JS for this snippet. You must use Bootstrap JS and CSS version 3.2.0
maxsurguy () - 10 years ago - Reply 0
hey what's up maxsurguy your website helps me a lot on school web projects thank your very much (Y)
NIRO () - 9 years ago - Reply 0