Ich muss div popup in der Mitte des Browser-Bildschirms positionieren (egal welche Größe der Bildschirm hat). Und ich möchte die Position als absolut beibehalten, da ich das Popup nicht nach unten bewegen möchte, wenn ich die Seite herunterscrolle.
Dieses div wird angezeigt, wenn auf die Schaltfläche mit Jquery geklickt wird.
Ich habe versucht, Rand-links auf die Hälfte der Breite wie in anderen Posts erwähnt, aber es funktioniert nicht für mich.
Hier ist mein Code
CSS-Code:
%Vor%HTML-Code:
%Vor%Danke !!
Ich schreibe einen Code in jquery. Es ist kein einfacher Weg gesehen. Aber ich hoffe, es ist nützlich für dich.
%Vor%Sie können CSS3 'transform' verwenden:
CSS:
%Vor%HTML:
%Vor% * Sie müssen also margin-left: -width/2 px;
Hinweis: Dies beantwortet nicht direkt Ihre Frage. Dies ist absichtlich.
A List Apart hat eine ausgezeichnete CSS Positioning 101 Artikel, der es wert ist gelesen zu werden ... mehr als einmal. Es gibt zahlreiche Beispiele, die unter anderem Ihr spezifisches Problem beinhalten. Ich empfehle es sehr.
Es ist ein klassisches Problem, wenn Sie scrollen, bleibt das modale Popup, das auf dem Bildschirm generiert wird, dort und scrollt nicht mit, so dass der Benutzer möglicherweise blockiert wird, da er das Popup auf seinem sichtbaren Bildschirm möglicherweise nicht sehen kann.
Der folgende Link bietet auch CSS-Code zum Erzeugen einer modalen Box zusammen mit ihrer absoluten Position.
Es hat eine Weile gedauert, die richtige Kombination zu finden, aber dies scheint den Overlay- oder Popup-Inhalt horizontal und vertikal zu zentrieren, ohne vorherige Kenntnis der Höhe des Inhalts :
HTML:
%Vor%CSS:
%Vor%Tags und Links html css position positioning