Pfeil am Bildschirmrand positionieren?

...komplette Frage anzeigen

3 Antworten

Dafür kannst du einfach die position-Eigenschaft auf "fixed" setzen und das Bild mittels "bottom" und ggf. "left" / "right" positionieren. Das Bild wird so platziert, dass die jeweilige Kante des Bildes den angegebenen Abstand zur jeweiliigen Kante des Viewports hat. (D.h. bei "right: 20px" wird die rechte Kante des Bildes 20px von der rechten Kante des Viewports entfernt dargestellt)

Das Verschwinden kannst du dann über das Scroll-Event mit Javascript lösen:

https://developer.mozilla.org/en-US/docs/Web/Events/scroll

Einfach das Scroll Event an das Dokument binden und dann über scrollTop die Scrollposition erfragen:

https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTop

Falls diese größer als 0 ist, entsprechend das Style anpassen. Kleine Demo: (mit jQuery und div-Container statt Bild, Prinzip bleibt gleich)

https://jsfiddle.net/7grs1r11/1/

Antwort bewerten Vielen Dank für Deine Bewertung

Könnte man in etwa so lösen: http://codepen.io/anon/pen/RRwgLZ

Der Pfeil wird ausgeblendet während der User scrollt oder wenn er am Ende der Seite angelangt ist.

Antwort bewerten Vielen Dank für Deine Bewertung

Was möchtest Du wissen?