plunker demo显示了使用touchswipe库的滑动事件功能。我需要能够在完全滚动页面(水平)后轻扫。(现在它正在滑动,如果你只是用手指移动鼠标/滑动)和我刷完后得到的新页面,应该有整个页面的不同背景颜色。(在给定的演示,它是HtmlPage1.html)任何人都可以帮助我吗?...
<script type="text/javascript">
var swipeOptions = {
allowPageScroll :"auto",
fingers:1,
swipeLeft:swipeLeft,
swipeRight: swipeRight
};
var threshold = 800;
$(function()
{
imgs = $("#slide1");
imgs.swipe(swipeOptions,threshold);
});
function swipeStatus(event, phase, direction, distance) {
debugger;
}
function swipeLeft(event,direction, distance, duration, fingerCount, fingerData, currentDirection) {
$("#x1").text("You Swiped " + event + distance + "_pixels distance " + duration + "_time in units " + fingerCount + fingerData + " in " + currentDirection + " direction");
}
function swipeRight(event,direction, distance, duration, fingerCount, fingerData, currentDirection) {
$("#x1").load("HtmlPage1.html").css('background-color', 'red');
}
</script>
</head>
<body>
<div id="slide1">
<div id="x1">
</div>
</div>
</body>
</html>
我有{strong>更新 Plunker Demo和代码。现在我需要在行
中调用 swipeLeft / swipeRight 方法alert('Left Reached!');
即。而不是alert()
,我需要调用touchswipe的滑动方法..
如何实现这一功能......任何人都可以帮助我吗?..
var swipeOptions = {
allowPageScroll :"auto",
fingers:1,
swipeLeft:swipeLeft,
swipeRight: swipeRight
};
var threshold = 800;
$(function()
{
imgs = $("#slide1");
imgs.swipe(swipeOptions,threshold);
imgs = $("#slide2");
});
$(window).scroll(function () {
if ($(window).scrollTop() + $(window).height() == $(document).height()) {
alert("bottom!");
}
});
$(window).scroll(function () {
if ($(window).scrollLeft() + $(window).width() == $(document).width()) {
alert('Left Reached!');
}
});
function swipeStatus(event, phase, direction, distance) {
debugger;
}
function swipeLeft(event,direction, distance, duration, fingerCount, fingerData, currentDirection) {
window.scrollTo(event.pageX, 0);
$("#x1").text("You Swiped " + event + distance + "_pixels distance " + duration + "_time in units " + fingerCount + fingerData + " in " + currentDirection + " direction");
}
function swipeRight(event,direction, distance, duration, fingerCount, fingerData, currentDirection) {
window.scrollTo(-event.pageX, 0);
$("#x1").load("HtmlPage1.html").css('background-color', 'red');
}