Wie erreicht man eine echte feste Positionierung in Mobile Safari?

Elemente in Mobile Safari fest positionieren

Elemente in Mobile Safari relativ zum Ansichtsfenster fest zu positionieren war eine wiederkehrende Herausforderung. Während die Position: Fixed-Eigenschaft oft nicht den gewünschten Effekt liefert, entstehen innovative Lösungen.

Implementieren einer festen Position mit JavaScript

Gmail hat kürzlich eine Technik eingeführt, die sich annähert feste Positionierung. Durch die Nutzung von Echtzeit-Scroll-Ereignissen, die über JavaScript erfasst werden, kann ein Element am unteren Rand der Seite verankert bleiben, während der Benutzer scrollt. Diese Lösung ist sowohl effektiv als auch effizient.

Um diese Technik zu implementieren, führen Sie den folgenden Code aus:

window.onscroll = function() {
  document.getElementById('fixedDiv').style.top =
     (window.pageYOffset + window.innerHeight - 25) + 'px';
};

Dieser Code weist der obersten Eigenschaft eines div-Elements mit dem Namen „fixedDiv“ einen neuen Wert basierend auf zu den Scroll-Offset der Seite, um sicherzustellen, dass sie unabhängig vom Scrollen unten fixiert bleibt.

Das obige ist der detaillierte Inhalt vonWie erreicht man eine echte feste Positionierung in Mobile Safari?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!