Comment obtenir un positionnement fixe dans Mobile Safari : un guide complet

Positionnement fixe dans Mobile Safari : un guide complet

Obtenir un positionnement fixe pour un élément par rapport à la fenêtre dans Mobile Safari peut être un défi. Malgré l'opinion largement répandue selon laquelle "position : fixe" ne fonctionne pas dans Mobile Safari, Gmail a introduit une solution innovante qui offre une approximation proche du véritable positionnement fixe.

Une approche pour résoudre ce problème consiste à exploiter JavaScript pour détecter les événements de défilement en temps réel. Cela vous permet d'ajuster dynamiquement la position d'un élément au fur et à mesure du défilement de la page.

Pour obtenir un div à position fixe qui défile vers le bas de la page, vous pouvez implémenter un simple script JavaScript :

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

En ajustant la propriété "top" de l'élément "fixedDiv" en fonction du décalage et de la hauteur de la page, le div maintiendra sa position en bas de la fenêtre pendant que l'utilisateur fait défiler. Le réglage "25" garantit que le div est légèrement décalé par rapport au bas de l'écran pour une visualisation optimale.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!