Tôi muốn tạo webapp (để tránh phải lập trình riêng cho iPhone, Android, BB, v.v.) và đang tìm kiếm hiệu ứng vuốt. Có mã HTML5 hoặc webkit đơn giản chỉ cần nói "vuốt đến trang tiếp theo/trang trước" không? (Tôi biết nó sẽ là mã chi tiết hơn thế, nhưng đó là ý chính của những gì tôi muốn)Trượt giữa các trang web cho webapp
7
A
Trả lời
6
bạn có thể sử dụng div để vuốt xung quanh nhưng không phải toàn bộ trang trong trình duyệt web.i, e bạn chỉ có thể tải các trang trong một div sau khi vuốt ảnh hưởng và không di chuyển toàn bộ trang.
chỉ hoạt động bằng chrome, safari.
đây là mã nếu bạn sử dụng điện thoại di động jquery.
$('body').live('swipeleft swiperight',function(event){
if (event.type == "swiperight") {
alert("swipped right side");
}
if (event.type == "swipeleft") {
alert("swipped left side");
}
event.preventDefault();
});
tham khảo thêm ở đây swipe detection
3
@sree đã cho tôi hầu hết con đường đó, nhưng đây là đoạn code tôi đã kết thúc bằng
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery Mobile: Demos and Documentation</title>
<link rel="stylesheet" href="css/themes/default/jquery.mobile-1.1.0.css" />
<link rel="stylesheet" href="docs/_assets/css/jqm-docs.css" />
<script src="js/jquery.js"></script>
<script src="docs/_assets/js/jqm-docs.js"></script>
<script src="js/jquery.mobile-1.1.0.js"></script>
</head>
<body>
<p>random page to test on</p>
<p>Swipe1 </p>
<script type="text/javascript">
$('body').live('swipeleft swiperight',function(event){
if (event.type == "swiperight") {
jQuery.mobile.changePage("page2.html",{transition:'slide'});
}
if (event.type == "swipeleft") {
jQuery.mobile.changePage("page1.html",{transition:'slide'});
}
event.preventDefault();
});
</script>
</body>
</html>
... và tôi đã tải về jquery mobile kit và giữ các tệp CSS/JS có cùng cấu trúc tệp
0
Tôi đã thực hiện https://github.com/caktux/swipy chỉ dành cho việc này. Tôi muốn nhận phản hồi từ các nhà phát triển khác và có thể biến nó thành plugin đi cho "trang web đáp ứng dưới dạng ứng dụng web" nếu có sự quan tâm.
Các vấn đề liên quan
- 1. Sử dụng lại các ổ cắm web giữa các trang?
- 2. Gửi thông tin xác thực giữa các trang web
- 3. Orchard cho các trang web tùy chỉnh
- 4. Nội dung web và webapp khác biệt
- 5. Admob cho trang web
- 6. GWT Vuốt giữa các trang/bảng
- 7. Sự khác biệt giữa Trang web và Ứng dụng web?
- 8. tiện ích twitter chỉ tải lần đầu tiên trong trang web ajax webapp?
- 9. tạo trang web cho iphone
- 10. iPhone WebApp cache
- 11. Google Chrome - Ghi đè trang trắng trống giữa các tải trang web
- 12. Miniprofiler cho trang web ASP.NET
- 13. Phiên dịch cho trang web
- 14. jquery di chuyển trượt chuyển tiếp ngược lại cho thấy trang trống ở giữa quá trình chuyển đổi
- 15. có nghĩa là chỉ dành cho các dịch vụ web HOẶC cho cả dịch vụ web VÀ các trang web?
- 16. Làm thế nào để tạo hiệu ứng kéo và trượt từ trang web này?
- 17. Tải nhanh các trang web
- 18. Sử dụng Openshift cho các trang web thương mại
- 19. Trang web tốt nhất cho các mẫu thiết kế?
- 20. Tạo tiện ích javascript cho các trang web khác
- 21. Bcrypt có khả thi cho các trang web lớn không?
- 22. Thiết kế URL RESTful cho các trang web
- 23. webapp maven để đặt jsps trong/WEB-INF/jsp
- 24. Django - Nhiều trang web Caching trang web
- 25. Dịch vụ web còn lại với App Engine và Webapp
- 26. FB.login dòng chảy bị hỏng cho iOS WebApp
- 27. Tài nguyên web ngữ nghĩa cho một trang web mới?
- 28. Tạo DAL cho trang web ASP.NET
- 29. Công nghệ cho trang web Phát video
- 30. Sơ đồ trang web cho nội dung động?
Cảm ơn @sree, điều này có vẻ đầy hứa hẹn, nhưng có cách nào để tạo liên kết div đến một trang HTML khác không? Tôi không thực sự muốn có tất cả nội dung trong một trang HTML và thích vuốt từ các trang. Vì vậy, về cơ bản
bạn có thể tải trên swipe các trang trong một div, hiệu ứng sẽ vẫn giống như tính năng vuốt, thay vì cảnh báo viết mã này $ ('# result'). Load ('page1.html'); – sree
Mèo con phải yêu bạn ... – DGund