Sticky div auf der linken Seite, scroll auf der rechten Seite

Question

Ich suchte nach Portfolio-Ideen und ich stieß auf diese besondere mit einem einfachen, aber schönen Design. Momentan bin ich nicht mehr in der Lage, dieses Layout zu implementieren, insbesondere das Sticking-Element. Ich habe keinen eigenen Code zum Vergleichen, aber kann mir jemand helfen, herauszufinden, wie es funktioniert? Vielen Dank!

http://melaniedaveid.com/

auch: Ich kann das Konzept bekommen für einen Abschnitt zu arbeiten, nur nicht eine Sekunde. (Geht also von dem Abschnitt „Info“ auf die „Work“ Abschnitt.

Answer 1

Was Sie suchen ist klebrig Positionierung. Es gibt mehrere Ansätze, so etwas zu implementieren. Eine gute Übersicht here gefunden werden kann .

ich denke, die einfachste Lösung, um die CSS-Eigenschaft position:sticky; zu verwenden ist. Aber es ist nicht aus wie position--sticky- so können Sie es gerade jetzt!

in vielen Browsern. zum Glück gibt es eine Reihe von polyfills zu wählen unterstützt So, wie man position:sticky; verwendet? Sie müssen auch sp ecify top Wert, der erforderlich ist, und gibt den Abstand von der oberen Kante an, an der das Element haften bleibt. Also wollen Sie es meistens top: 0;. Und dann - beim Scrollen - wenn der Abstand des Elements von oben 0 erreicht, bleibt das Element haften.