Ich versuche, einen modalen Dialog im gescrollten Fenster zu zentrieren. Dieses Modal ist absolute Position, da es im Bildschirm ziehbar sein muss. Ich benutze dieses Plugin für ziehbare Funktion:
Mein Problem ist, dass dieses Modal die absolute Position hat, wenn ich top setze: 50% zeigt es modal im mittleren Fenster an, aber nicht das gesamte gescrollte Fenster.
Sie sollten
verwenden %Vor%stattdessen absolut / relativ.
position: fixed Das Element ist relativ zum Browserfenster positioniert.
Verwenden Sie dies, und Sie sollten keine Probleme durch Scrollen haben.
Sie können diese Themen auch sehen:
Feste Positionierung ohne Scrollen
Wie Sie ein Div-Center von platzieren das Fenster nach dem Scrollen
Wenn es sich in einem scrollbaren div befindet, stellen Sie sicher, dass das ursprüngliche div: <div style="position:relative;">
.
Auf diese Weise wird ein div
darin, das absolut ist, innerhalb der Grenzen davon bleiben und sein übergeordnetes relatives div als Referenzpunkt für top:50%;
Im Allgemeinen finden Sie den Mittelpunkt des Ansichtsfensters mit Bildlaufleisten. Nimm die Fensterhöhe, geteilt durch 2, plus Scroll oben. Ergebnis ist die Anzahl der Pixel, die etwas von der Dokumentenspitze versetzt werden soll.
Wenn Ihr positioniertes Element ein untergeordnetes Element von mehr als einem scrollbaren Element ist, müssen Sie diese berücksichtigen, aber die grundlegende Mathematik ist die gleiche.
Als eine Randnotiz würde ein Beispiel für das Markup, das Sie verwenden möchten, dazu beitragen, genauere Antworten zu erhalten.
Tags und Links jquery css modal-dialog draggable center