Bootstrap: Wie zum Deaktivieren der vertikalen Bildlaufleiste?

Wenn sich mein modales Popupfenster öffnet, wird eine vertikale Bildlaufleiste rechts neben dem Browserfenster hinzugefügt. Wie deaktiviere ich das? Ich denke, das ist aktiviert, wenn das modale Fenster einen sehr großen Wert hat, wo es scrollen muss. Ich möchte dies deaktivieren, da meine Formularhöhe die Fensterhöhe nicht überschreitet.Bootstrap: Wie zum Deaktivieren der vertikalen Bildlaufleiste?

Quelle

2013-07-18 user1929393

hat das wenig zu mach mit Bootstrap. Machen Sie sich mit den Entwicklungstools von Firebug oder Chrome vertraut und überprüfen Sie die HTML-Struktur. Ändern Sie bei Bedarf mit CSS. – isherwood

Ich vermute, dass dies ein Hinweis auf ein anderes Problem ist - vielleicht ein schlechtes Markup. Achten Sie darauf, zu validieren. –

@isherwood - Dies hat mit Bootstrap zu tun. Wie in der folgenden Antwort alx gezeigt, enthält Bootstrap 3 tatsächlich die Anweisung .modal {overflow-y: scroll; } Keine Ahnung, warum es nicht automatisch ist, aber auf jeden Fall ... –

in Ihrem CSS add:

body { 
    overflow-y:hidden; 
}

Quelle

2013-07-18 14:43:51

Es fügt dem Körper auch eine Modal-Open-Klasse hinzu, die einen 15px-Rand rechts hinzufügt, möglicherweise um den Scollbar zu kompensieren, aber den Inhalt nach links verschiebt wenn die Bildlaufleiste nicht sichtbar ist. diese Definition hinzufügen, dass entfernen: 'body.modal offen, .modal offene .navbar-Festplatte, .modal offene .navbar fest Boden { \t margin-right: 0; } ' – sp00n

Wenn das Modell Fensterhöhe nicht mehr als normale Fensterhöhe ist, macht es keinen Sinn, die die Bildlaufleiste angezeigt werden soll. Überprüfen Sie das Wetter, das <div></div> verwendet, um den Hintergrund hinter dem Modellfenster verblassen hat eine zusätzliche Höhe als der Aussichtspunkt.

Quelle

2013-07-18 14:52:40 Hawckins

Ich habe das gleiche Problem mit Bootstrap 3.0.0. Es scheint, dass .modal Klasse hat overflow-y: scroll Regel, die Scrollbar immer sichtbar führt.

So können Sie diese Änderung entweder lokal:

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

oder global:

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

Quelle

2013-09-10 09:26:30 alx

Nice1! Dies funktioniert wie erwartet und sollte die gewählte Antwort sein. Vielen Dank. – metamagicson

Die Frage ist: Warum setzt Bootstrap es so? Ich würde es nicht anfassen, wenn ich nicht genau wüsste, was vor sich ging. Fragte unter: https://github.com/twbs/bootstrap/issues/7972 –

Ich musste auch die Auffüllung von Body-Tag entfernen. Diese Kombination hat also für mich funktioniert. .modal {Überlauf-y: Auto;} .modal-open {padding-right: 0! wichtig;} – JacobLett

style In den Körper als:

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

Quelle

2015-03-31 06:41:06

Bootstrap: Wie zum Deaktivieren der vertikalen Bildlaufleiste?

Antwort

Verwandte Themen