DIV Eigenschaft erst nach z.B. 100px Scrolling?

Das die Textfarbe sich nach 100px Scrollen ändert.

Answer 1

[MrAmazing2]

Das macht man mit einem scroll-Eventlistener. In diesem überprüft man, ob pageYOffset > 100px ist, und ändert die Textfarbe dementsprechend.

HTML:

<div style="height: 60vh"></div>
<div id="deinDiv">Test</div>
<div style="height: 60vh"></div>

JS:

document.addEventListener("scroll", e =>
  document.getElementById("deinDiv").classList.toggle("updatedColor", window.pageYOffset > 100)
);

CSS:

.updatedColor {
  color: white;
  background-color: black;
  transition: 0.5s;
}

https://jsfiddle.net/4c3r1awo/

Woher ich das weiß: Hobby – Programmieren ist mein Hobby & Beruf

Answer 2

[Ireeb]

Das geht nicht ohne weiteres, sondern erfordert den Einsatz von JavaScript.

Entweder musst du selbst etwas z.B. mit dem onscroll Event basteln

https://www.w3schools.com/jsref/event_onscroll.asp

Oder eine Library wie ScrollMagic einbinden.

Woher ich das weiß: Berufserfahrung – Tätigkeit als Webentwickler in einer Digitalagentur