CSS: Comment empêcher le défilement sur iOS Safari?
J'ai créé un modal. Lorsque le modal est ouvert, j'arrête le défilement sur le bureau avec overflow:hidden; à la <body>. Ça marche.
Mais cela ne fonctionne pas sur mon iPhone 6s Mobile Safari.
Comment puis-je empêcher le défilement lorsque le modal est ouvert dans Safari mobile?
Il n'y a pas (à ma connaissance) un excellent moyen d'accomplir cela avec CSS sans répercussions sur l'UX.
Bien que ce soit Javascript, et non CSS, la meilleure façon de le faire est la suivante:
// Disable scrolling.
document.ontouchmove = function (e) {
e.preventDefault();
}
// Enable scrolling.
document.ontouchmove = function (e) {
return true;
}
Combinez-le avec position: fixed pour le faire sur iOS…
overflow: hidden;
position: fixed;