Comment puis-je désactiver le défilement dans Mobile Safari ?

Désactivation du défilement dans Mobile Safari : un guide complet

Mobile Safari, tout en offrant une expérience de navigation intuitive, peut poser des problèmes lorsque vous tentez de désactiver faire défiler de longues pages. Ce problème survient lorsque le contenu s'étend au-delà de l'écran visible de l'utilisateur, conduisant potentiellement à un comportement de défilement indésirable.

Pour résoudre ce problème, on peut instinctivement appliquer la propriété 'overflow:hidden' de CSS à l'élément body. Cependant, cette approche échoue souvent dans les environnements Safari mobiles, laissant les développeurs perplexes.

Pour surmonter cette limitation, la solution réside dans l'extension de la propriété 'overflow:hidden' au-delà de l'élément body pour inclure également l'élément HTML. En définissant à la fois « html » et « body » sur « overflow:hidden », vous empêchez efficacement le défilement de la fenêtre du navigateur, limitant ainsi le contenu à la fenêtre d'affichage visible.

html,
body {
    overflow: hidden;
} 

Pour iOS 9 en particulier, un paramètre supplémentaire des ajustements peuvent être nécessaires :

html,
body {
    overflow: hidden;
    position: relative;
    height: 100%;
}

En appliquant ces modifications CSS, vous pouvez désactiver efficacement le défilement sur Safari mobile, garantissant ainsi que votre contenu reste parfaitement contenu dans le écran visible de l'utilisateur.

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!