Phonegap- (Android/iphone) Thư viện hình ảnh với nhiều hình ảnh đang đưa ra sự cố?

Question

Tôi đã tạo một thư viện hình ảnh bằng HTML5, JavaScript và CSS bằng cách sử dụng jQuery mobile. Nền tảng IE Phonegap ok.
Các hình ảnh được sắp tự động và được nạp trong nó, như thế này:
http://torontographic.com/wordpress/mouseSwipe/mouseSwipe.html

Trên mouseSwipe Slider:

TYPE: 'mouseSwipe' 
HORIZ: true 
plugin available at 
torontographic.wordpress.com 

Vấn đề sắp tới với nó là tôi không thể nhấp vào hình ảnh và đi đến trang tiếp theo, vì hai sự kiện xảy ra cùng nhau.

Vấn đề thứ hai là tôi không thể vuốt trang xuống, từ nơi đặt thư viện, ngoại trừ khu vực khác không có thư viện.

Để làm rõ hơn, tôi đang tạo ứng dụng tin tức mà tôi đã thêm thư viện 5 - 10 như ứng dụng Tin tức xung.

Answer 1

Tôi hơi bối rối về một số chi tiết của sự cố, nhưng tôi không muốn thấy câu hỏi này hoàn toàn không được trả lời trong trường hợp người khác gặp sự cố này.

Plugin này (mouseSwipe) ghi đè chức năng kéo mặc định cho thiết bị di động. Trong khi các thiết bị thông thường sẽ cuộn trang trên sự kiện bắt đầu chuột, plugin này sẽ ghi đè hành vi đó để phát hiện chuyển động nhấp qua một phần tử. Vì nó ngắt chức năng đó, kéo hướng ngược lại (để cuộn) cũng bị hỏng. Nếu plugin vẫn được duy trì bởi chủ sở hữu (nó không xuất hiện), nó có thể được cập nhật để khắc phục sự cố này hoặc phát ra các sự kiện có thể được sử dụng để tạo thủ công chức năng bạn muốn.

Tôi cho rằng đây cũng là nguyên nhân khiến bạn gặp khó khăn khi nhấp để truy cập trang được chỉ định.

Nếu bạn muốn ý kiến ​​trung thực của mình, tôi sẽ chọn một thư viện khác, có thể chỉ tập trung vào khả năng swipability của thiết bị di động, và sau đó xử lý riêng chức năng desktop (mặc dù, nếu bạn đang sử dụng PhoneGap, thậm chí không xuất bản trang này lên nền tảng web cho máy tính để bàn). Nếu nó sẽ là trên trang web, bạn có thể sử dụng Modernizr (hoặc tương tự) để tìm hiểu xem thiết bị hỗ trợ đầu vào cảm ứng, và sau đó thực hiện một cái gì đó như sau:

http://labs.rampinteractive.co.uk/touchSwipe/demos/Image_gallery_example.html

Đối với thiết bị mà không làm hỗ trợ cảm ứng, bạn có thể quay trở lại nút/mũi tên dựa trên chuyển hướng (sau khi tất cả, như một người dùng máy tính để bàn, tôi không mong đợi để có thể kéo nó qua lại với con chuột).

Answer 2

Trong tệp http://torontographic.com/wordpress/mouseSwipe/jquery.mouseSwipe.js chức năng onmousedown có mã bên dưới. Điều này sẽ ngăn chặn sự kiện từ hành vi mặc định và trong trường hợp dừng chụp/phát ra. Bạn có thể muốn xem chúng hoặc cách sự kiện đang được xử lý bởi các thư viện.

e.preventDefault() 

Dưới đây là thông tin thêm về cách ngăn chặn hoạt động truyền bá và hành vi thường xuyên của JQuery.

event.preventDefault() vs. return false What is event bubbling and capturing?

Answer 3

Lý do bạn không thể vuốt lên và xuống có thể do rằng "swipe" Sự kiện này được hogging "movestart" hoặc sự kiện "di chuyển".

Tôi chạy vào một vấn đề tương tự một lần khi sử dụng plugin này: http://stephband.info/jquery.event.swipe/

Giải pháp của họ như đã được chỉ ra trên trang web của họ là để gọi phương thức preventDefault về sự kiện này để giữ cho nó khỏi chặn như đã thấy ở đây.

jQuery('.mydiv') 
.on('movestart', function(e) { 
    // If the movestart is heading off in an upwards or downwards 
    // direction, prevent it so that the browser scrolls normally. 
    if ((e.distX > e.distY && e.distX < -e.distY) || 
     (e.distX < e.distY && e.distX > -e.distY)) { 
    e.preventDefault(); 
    } 
}); 

Tôi không có kinh nghiệm với jQuery thoại di động, nhưng tôi sẽ nghĩ những vấn đề tương tự.