Bạn thử vuốt trong khung này nhé.
Sự kiện vuốt
Để xử lí sự kiện vuốt, bạn dùng jQuery và touchSwipe.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.touchswipe/1.6.19/jquery.touchSwipe.min.js" integrity="sha512-YYiD5ZhmJ0GCdJvx6Xe6HzHqHvMpJEPomXwPbsgcpMFPW+mQEeVBU6l9n+2Y+naq+CLbujk91vHyN18q6/RSYw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
Cách sử dụng như sau.
jQuery(document).ready(function($) {
$('.touch-area').swipe({
tap: function(event, target) {
$('.touch-area').html('Sự kiện: Nhấp (Tap)');
},
swipe: function(event, direction, distance, duration, fingerCount, fingerData) {
if (direction == 'left') $('.touch-area').html('Sự kiện: Vuốt qua trái');
if (direction == 'right') $('.touch-area').html('Sự kiện: Vuốt qua phải');
},
allowPageScroll: 'vertical' // Chỉ chấp nhận sự kiện vuốt ngang
});
});
Chúc các bạn thành công!
Bình Luận