Tôi đã tạo một phương thức. Khi phương thức được mở, tôi sẽ dừng cuộn trên Màn hình với overflow:hidden; tới <body>. Nó hoạt động.CSS: Cách ngăn cuộn trên iOS Safari?
Nhưng nó không hoạt động trên iPhone 6s Mobile Safari của tôi.
Làm cách nào để ngăn việc cuộn khi phương thức được mở trong safari di động?
Kết hợp nó với position: fixed để làm điều này trên iOS ...
overflow: hidden;
position: fixed;
Không có (theo tôi biết) một cách tuyệt vời để thực hiện điều này với CSS mà không ảnh hưởng trên UX.
Trong khi đó là Javascript, và không CSS, cách tốt nhất mà tôi đã tìm thấy để làm điều này là như sau:
// Disable scrolling.
document.ontouchmove = function (e) {
e.preventDefault();
}
// Enable scrolling.
document.ontouchmove = function (e) {
return true;
}
Nếu bạn đang sử dụng cho các modals, rất có thể là bạn đang sử dụng javascript anyway ... do đó, công trình này tuyệt vời. Đây là giải pháp tốt nhất tôi đã tìm thấy, như thiết lập vị trí: cố định đặt lại vị trí di chuyển trên trang. Nếu bạn chỉ ghép cặp này với tràn: ẩn, nó hoạt động cho cả máy tính để bàn và thiết bị di động và không ảnh hưởng đến vị trí cuộn – TinMonkey
Điều này cộng với 'overflow: hidden' là điều duy nhất tôi có thể làm việc được –
Thử nghiệm trên Iphone 7. Đây không phải là làm việc. – Azarus
Xin lỗi vì đã hồi sinh một chủ đề cũ, nhưng câu trả lời này chỉ hoạt động nếu phương thức đang được kích hoạt trong khi trang được cuộn tất cả các cách trên cùng. Nếu trang được cuộn xuống ở tất cả thì cài đặt "position: fixed" sẽ cuộn bạn trở lại đầu trang trước khi kích hoạt phương thức thay vì để bạn ở nơi bạn đang ở khi bạn kích hoạt phương thức. Có một giải pháp mà địa chỉ này là tốt? –
@ 0sin Đặt 'chiều cao' của cơ thể thành' scrollHeight', sau đó đặt con 'fixed' và sử dụng' transform: 'translateY (-' + body.scrollTop + 'px)' 'trên chúng – aleclarson