Làm cách nào để dừng di chuyển trang trong khi .... vẫn cho phép cuộn?

Question

Tôi đang tạo ứng dụng dành cho thiết bị di động với PhoneGap. Tôi đã có này--

function preventBehavior(e) 
{ 
e.preventDefault(); 
}; 
document.addEventListener("touchmove",preventBehavior, false); 

Bạn biết làm thế nào bạn có thể kéo một trang một cách nhỏ xíu ra khỏi màn hình điện thoại thông minh bằng cách kéo nó, và sau đó nó bật trở lại ngay khi bạn phát hành nó? Và tất cả những gì bạn thấy đằng sau nó là màu đen? Đó là những gì mã này có nghĩa là để ngăn chặn. Và nó có.

Nhưng nó cũng ngăn tất cả cuộn tiêu chuẩn, chẳng hạn như cuộn qua danh sách. có ai biết cách giải quyết không?

Answer 1

Một giải pháp dễ dàng cho Cordova 1.7+ Định vị Cordova.plist trong dự án Xcode của bạn. Ở đầu nó sẽ nói “UIWebViewBounce“. Đặt điều này thành NO.

Answer 2

bạn có hai lựa chọn:

1. iScroll - Siêu hiệu quả trong việc đưa ra hiệu ứng này. Cấp nó có những hạn chế của nó.

2. -webkit-overflow-scrolling: chạm; một phương pháp css mới được giới thiệu trong ios 5 nó hoạt động tốt nhưng lại có những hạn chế trong điện thoại.

Cá nhân tôi sử dụng iScroll cho ứng dụng phonegap, nó hoạt động tuyệt vời nếu bạn không có danh sách siêu lớn các mục bạn đang cuộn. Nếu bạn đang tìm kiếm một cách bản địa hơn tôi sẽ đề nghị phương pháp overflow-scrolling, điều này đã chứng minh là gây ra một số hiệu ứng lạ trong webview. Phonegap sử dụng webview vs safari di động để hỗ trợ của bạn khác một chút.

iScroll - http://cubiq.org/iscroll-4 webkit-scrolling - http://johanbrook.com/browsers/native-momentum-scrolling-ios-5/

Answer 3

Bạn nên thêm này trong thẻ đầu của bạn: (Không cần mã listener của bạn bây giờ)

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" /> 

này về cơ bản vô hiệu hóa rộng (phóng to/out) và hiệu ứng kéo mà bạn không muốn. Vì vậy, trang sẽ không được cuộn nhưng sự kiện touchmove vẫn có thể được theo dõi.