Klebrig, wie ein Lokales Fest?

0
49

Lemme die Bühne ein bisschen hier.

Sie haben eine Webseite und, wie die meisten, es scrollt.

Diese website wird modals. Sie werden wahrscheinlich position: fixed am modal, so dass es vorhersehbar positioniert, unabhängig von scrollen. Es ist möglich, daß die modalen selbst scrollt.

Beachten Sie die modal hat einen schließen-button. Wir können das position: absolute, dass Sie in der oberen rechten Ecke, aber wenn wir den modal Schriftrollen, es ist ein problem.

Wir haben verloren die schließen-Schaltfläche hinter den Blättern.

Sollte ein Auftrag für weitere position: fixed, right? Nicht wirklich, leider, denn es gibt keine solche Sache wie eine lokale Kontext für position: fixed.

Naja… eigentlich ist es irgendwie (komischerweise). Wenn der modale jede Art von CSS-Transformation auf (und es vielleicht schon, wenn Sie es mittig mit dem ol’ left: 50%; transform: translateX(-50%); trick), dann die fixed-position-Schaltfläche schließen, wird wieder nach Hause kommen:

Aber… da die Transformation geholfen, ziehen Sie die Schaltfläche schließen zurück in den Ort, können Sie sehen, verhält es sich wie position: absolute und nicht-position: fixed. _(ツ)_/

Gibt es eine Möglichkeit, sich hier aber. Die Idee ist, dass position: sticky ist, in einem gewissen Sinne ein lokal gültigen position: fixed. Wenn wir die position der schließen-Schaltfläche in der oberen: 0 sowieso, werde es einfach halten es als modales scrollt.

Ich dachte nur, dies war eine interessante Möglichkeit. Letztlich, um ehrlich zu sein, hätte ich modals ich machte mir sorgen über scrollen, ich würde wahrscheinlich wie ein .modal-header-container und eine .modal-content-container. Der header sitzt oben auf immer, und der Behälter wäre die Sache, konnte Sie die Navigationstaste.