Tạo mục cố định vị trí cố định hoạt động trên iOS Safari

Question

Trên safari của iOS, thao tác quét một ngón tay sẽ không tạo ra bất kỳ sự kiện nào cho đến khi người dùng ngừng quay. Sự kiện đăng ký chỉ được tạo khi trang ngừng di chuyển và vẽ lại.

Tôi cần một cách để phát hiện cuộn thời gian thực. Cụ thể, tôi muốn tạo một menu dính cũng sẽ hoạt động trên safari iOS. Trên các trình duyệt không di động, có thể thực hiện trình đơn dính bằng cách chuyển đổi giữa "vị trí tương đối" thành "vị trí cố định" trên phần tử trong khi nghe các sự kiện trên bảng điều khiển. Phương pháp này sẽ không hoạt động trên trình duyệt dành cho thiết bị di động vì các sự kiện đăng ký không liên tục bị sa thải. Tôi có thể làm gì?

Answer 1

Trả lời câu hỏi của riêng tôi. iOS7 bây giờ hỗ trợ vị trí: dính Demo: http://html5-demos.appspot.com/static/css/sticky.html

Answer 2

Nếu tất cả những gì bạn muốn là một trình đơn dính, bạn có thể tiết kiệm cho mình một số nhức đầu bằng cách sử dụng thư viện hiện có. Tôi đã thành công với iScroll:

http://cubiq.org/iscroll

Ít nhất, bạn có thể có một cái nhìn tại cách làm việc này và căn cứ giải pháp của bạn xung quanh đó.

Hacking vui vẻ!

Answer 3

Chủ đề cũ chắc chắn, nhưng tôi có thể thấy nhiều lượt truy cập tại đây. Nếu tất cả những gì bạn muốn, là một trình đơn dính, bạn có thể sử dụng định vị cố định. Không cần iScroll ở đó.

Answer 4

Gần đây tôi đã dành nhiều giờ để tìm ra giải pháp thiết thực cho cùng một vấn đề. Không có cách nào đúng để làm điều này, mặc dù có một vài hacks khá (hầu hết trong số họ đã đề cập). Vấn đề là JavaScript bị tạm dừng trong khi người dùng đang cuộn. Nó có ý nghĩa khi bạn xem xét các tác động, nhưng nó làm cho nó khó khăn để thực hiện các yếu tố cố định vị trí.

Điều tốt nhất mà tôi có thể tìm thấy là bài đăng tuyệt vời này của những người ở Google. Bạn có thể xem http://gmail.com trong safari di động để xem nó hoạt động.

https://developers.google.com/mobile/articles/webapp_fixed_ui

Hy vọng điều này sẽ hữu ích.

Answer 5

Tôi đã gặp sự cố tương tự và trình xử lý bị ràng buộc để chạm/chạm/chạm/sử dụng jquery để phát hiện di chuyển một ngón tay và nó hoạt động hoàn hảo. Trong trường hợp của tôi, tôi cần phải di chuyển một phần tử khác với số lượng tương tự như di chuyển cố gắng của một phần tử khác và nó được cập nhật độc đáo khi cuộn đã được cố gắng để nó phải phù hợp với yêu cầu của bạn.