So erreichen Sie eine feste Positionierung in Mobile Safari: Eine umfassende Anleitung

Feste Positionierung in Mobile Safari: Ein umfassender Leitfaden

Eine feste Positionierung für ein Element relativ zum Ansichtsfenster in Mobile Safari zu erreichen, kann eine Herausforderung sein. Trotz der weit verbreiteten Meinung, dass „Position: fest“ in Mobile Safari nicht funktioniert, hat Gmail eine innovative Lösung eingeführt, die eine echte Annäherung an die tatsächliche feste Positionierung bietet.

Ein Ansatz zur Lösung dieses Problems besteht darin, JavaScript zu nutzen Erkennen Sie Scroll-Ereignisse in Echtzeit. Dadurch können Sie die Position eines Elements beim Scrollen der Seite dynamisch anpassen.

Um ein Div mit fester Position zu erreichen, das zum Ende der Seite scrollt, können Sie ein einfaches JavaScript-Skript implementieren:

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

Durch Anpassen der „top“-Eigenschaft des „fixedDiv“-Elements basierend auf dem Versatz und der Höhe der Seite behält das Div seine Position am unteren Rand des Ansichtsfensters bei, während der Benutzer scrollt. Die „25“-Einstellung stellt sicher, dass das Div für eine optimale Anzeige leicht vom unteren Bildschirmrand versetzt ist.

Das obige ist der detaillierte Inhalt vonSo erreichen Sie eine feste Positionierung in Mobile Safari: Eine umfassende Anleitung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!