Pracuję nad moim własnym sidemenu nav, które po uruchomieniu na małym ekranie powinno pojawić się i wyjść.

Chciałbym, aby reszta ekranu zmieniła kolor na szary, tak jak to dzieje się w Bootstrap 3, gdy wyświetlany jest modal.

Czy istnieje sposób na ponowne użycie szarego tła Bootstrap w tym celu? Innymi słowy pokaż / ukryj szare tło bez modala, używając jQuery?

Na potrzeby tego pytania możesz sobie wyobrazić, że na pustej stronie HTML chciałbym wyświetlić szare tło bez żadnego modalu.

Dzięki

Odpowiedzi:

Tak, mam twoje problemy, to tylko "klasa", która odpowiada za szare tło i modalność. Klasa musi być obecna w div rodzica.

<div class="modal-backdrop">
<div class="child-component">
<div class ="panel"></div>
</div>
</div>

css

.modal-backdrop {
background: rgba(22, 22, 22, 0.5) !important;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
}
.hide{
display:none;
}

Musisz przełączyć klasę "connect-modal-backdrop" z klasą "ukryj", aby pokazać / ukryć Modal.