<div id="test">
請在這裡滑動
</div>
html, body {
padding: 0;
margin: 0;
height: 100%;
}
#test {
background: #1a6f7a;
color: white;
height: 100%;
text-align: center;
font-size: 26px;
padding-top: 1rem;
}
$(function() {
$("#test").swipe({
threshold: 0,
swipe:function(event, direction, distance, duration, fingerCount, fingerData, currentDirection) {
console.log([event, direction, distance, duration, fingerCount, fingerData, currentDirection]);
$(this).text("滑動方向 " + direction );
}
});
// 額外設定,例如手指頭支援的數量
$("#test").swipe( {fingers:2} );
});
This Pen doesn't use any external CSS resources.