Sie könnten dies stattdessen versuchen. Ich denke, es sieht besser aus als ein Menü, das die gesamte Seite einnimmt und das gewünschte Ergebnis erzielt.
https://jsfiddle.net/rjx3460f/4/
var mywindow = $('#window');
$('#navbar').on('show.bs.collapse', function(x) {
mywindow.css({visibility: 'hidden'});;
$('body').attr("scroll","no").attr("style", "overflow: hidden");
});
$('#navbar').on('hide.bs.collapse', function(x) {
mywindow.css({visibility: 'visible'});
$('body').attr("scroll","yes").attr("style", "");
});
Die allgemeine Idee ist, dass Sie blättern auf der Seite zu deaktivieren, und den Inhalt auszublenden, wenn das Menü geöffnet ist. Sie können Scroll jedoch genauso einfach deaktivieren. Oder stellen Sie die Höhe des Menüs auf 100% ein, wenn sich die Dinge öffnen.
Hier ist das Menü, das die ganze Sache aufgreift. Sehr ähnliches Setup, aber hat einen Sprung Übergang ... Ich denke, Sie müssen möglicherweise Ihre eigenen offenen Übergang zu schaffen, um es nicht nervös zu machen, was nicht unmöglich ist, aber dann nicht mehr wirklich Bootstrap.
https://jsfiddle.net/rjx3460f/7/
ist es ein Dropdown-Menü oder der Seitenleiste. Teilen Sie Code, was Sie versucht haben? – Manish
Es ist das Hamburger Navbar-Menü. Ich nehme an, das ist ein Dropdown-Menü? Ich habe noch keinen Code angewendet, da ich denke, dass ich Standard-BS-Verhalten neu schreiben müsste, was ich zögere zu tun. Ich frage mich nur, ob es da draußen eine Workaround gibt. –
ok, was Sie wollen, ist, dass das Menü die volle Breite sowie die Höhe des Gerätes beim Öffnen einnehmen sollte. Wäre gut, wenn Sie nur eine Demo Ihres vorhandenen Menüs erstellen können. – Manish