Was macht Position Sticky?
Was macht Position Sticky?

Video: Was macht Position Sticky?

Video: Was macht Position Sticky?
Video: CSS Position: Fixed Vs Sticky | Css Basic | Html | MrNakxa #html #css #mrnakxa #shorts 2024, Kann
Anonim

Ein Element mit Position : klebrig ; wird basierend auf dem Scrollen des Benutzers positioniert Position . EIN klebrig Element schaltet zwischen relativ und fest um, je nach Scroll Position . Es wird relativ bis zu einem bestimmten Offset positioniert Position wird im Ansichtsfenster erfüllt - dann "klebt" es (wie Position :Fest).

Ebenso, wie mache ich meine Position klebrig?

Um die Wirkung von zu sehen klebrige Positionierung , wähle aus Position : klebrig Option und scrollen Sie durch diesen Container. Das Element scrollt zusammen mit seinem Container, bis es sich ganz oben im Container befindet (oder den in top angegebenen Offset erreicht) und hört dann auf zu scrollen, sodass es sichtbar bleibt.

Wissen Sie auch, was der Unterschied zwischen Position sticky und fixed ist? Ohne auf konkrete Details einzugehen, Position : klebrig verhält sich im Grunde wie Position : relativ, bis ein Element über einen bestimmten Offset hinaus gescrollt wird. In diesem Fall wird es zu Position : Fest , wodurch das Element an seinem kleben bleibt Position anstatt aus dem Blickfeld gescrollt zu werden.

Kann ich in diesem Zusammenhang CSS Position Sticky verwenden?

CSS

Position : klebrig

wird in Firefox, Safari und Chrome Canary (56+) unterstützt. CSS-Position : klebrig wird in Firefox, Safari und Chrome Canary (56+) unterstützt.

Was ist Webkit-Sticky?

Position : klebrig ist ein neuer Weg Position Elemente und ist konzeptionell ähnlich zu Position : Fest. Der Unterschied besteht darin, dass ein Element mit Position : klebrig benimmt sich wie Position : relativ innerhalb des übergeordneten Elements, bis ein bestimmter Versatzschwellenwert im Ansichtsfenster erreicht wird.

Empfohlen: