2013-07-18 18 views
16

po otwarciu mojego modalnego okna podręcznego dodaje pionowy pasek przewijania po prawej stronie okna przeglądarki. Jak mogę to wyłączyć? Myślę, że jest to możliwe, gdy okno modalne ma bardzo dużą wartość wysokości, która musi przewijać. Chcę to wyłączyć, ponieważ wysokość mojego formularza nie przekracza wysokości okna.Bootstrap: jak wyłączyć pionowy pasek przewijania?

+0

To ma niewiele wspólnego robić z Bootstrap. Zapoznaj się z narzędziami Firebug lub Chrome i sprawdź strukturę HTML. Zmodyfikuj w razie potrzeby za pomocą CSS. – isherwood

+0

Podejrzewam, że to wskazuje na inną kwestię - być może złe oznaczenia. Pamiętaj, aby sprawdzić. –

+2

@isherwood - Ma to związek z bootstrapem. Jak wskazuje alx w odpowiedzi poniżej, bootstrap 3 rzeczywiście zawiera dyrektywę .modal {overflow-y: scroll; } Nie mam pojęcia, dlaczego to nie jest auto, ale w każdym razie ... –

Odpowiedz

27

W swojej css dodatku:

body { 
    overflow-y:hidden; 
} 
+4

Dodaje także do klasy ciało otwarte modalnie, które doda margines 15 pikseli na prawo, ewentualnie w celu zrekompensowania paska scollbar, ale przesunięcie zawartości w lewo jeśli pasek przewijania nie jest widoczny. Dodaj tę definicję do usuwania, że: 'body.modal-otwartą, .modal otwarte .navbar utrwalonych-top, .modal otwarte .navbar utrwalonych-bottom { \t margin-right: 0; } ' – sp00n

0

Jeśli model okno wysokość wynosi nie więcej niż normalnej wysokości okna, to nie ma żadnego sensu, aby wyświetlić pasek przewijania. Sprawdź pogodę, aby dowolne tło z tyłu okna modelu miało zbyt wysoką wysokość niż punkt widzenia.

29

Mam ten sam problem z bootstrap 3.0.0. Wygląda na to, że klasa .modal ma regułę overflow-y: scroll, co powoduje, że pasek przewijania jest zawsze widoczny.

Tak, można zmienić to zarówno lokalnie:

<div class="modal" ... style="overflow-y: auto;"> 
    ... 
</div> 

lub globalnie:

<style> 
.modal { 
    overflow-y: auto; 
} 
</style> 
+1

Nice1! Działa to zgodnie z oczekiwaniami i powinna być wybraną odpowiedzią. Dziękuję Ci. – metamagicson

+0

Pytanie brzmi: dlaczego Bootstrap tak to określa? Nie dotknęłbym tego, chyba że dokładnie wiedziałbym, co się dzieje. Zapytany na: https://github.com/twbs/bootstrap/issues/7972 –

+0

Musiałem również usunąć wyściółkę ze znacznika body. Więc to połączenie zadziałało dla mnie. .modal {overflow-y: auto;} .modal-open {padding-right: 0! important;} – JacobLett

0

Dodaj styl do ciała jak:

body { 
    padding-right: 0px !important; 
    overflow-y: hidden !important; 
}