3

I have a website page and I've added to the body of the page touch events. More exactly for swipe right and swipe left. Since the event listener is added to the body of the page and I have added event.preventDefault(); i can't scroll the page any more.

How can i scroll the page in the browser ?

P.S. The code is pure javascript / library agnostic.

Edit #1. This site viewed in mobile seems to do it http://swipejs.com/ . It slides the tabs right to left and back as well as scroll the website. I just can't seen in the code how :(

4

3 回答 3

1

使用iscroll插件。它对你有帮助。

见例子：http ://cubiq.org/dropbox/iscroll4/examples/simple/

于 2012-12-02T02:24:59.940 回答
0

我有与没有“preventDefault（）”的刷卡相同的问题。因为我想实现一个pulltorefresh的效果，所以只能阻止pulldown事件，不能阻止pullup。像这样的代码：

function touchBindMove(evt){
    //evt.preventDefault();
    try{
        var deviceHeight = window.innerHeight;
        var touch = evt.touches[0]; //获取第一个触点  
        var x = Number(touch.pageX); //页面触点X坐标  
        var y = Number(touch.pageY); //页面触点Y坐标  
        //记录触点初始位置  

        if((y - offsetStart) > 0 && document.body.scrollTop == 0){
            evt.preventDefault();
            var page = document.getElementsByClassName('tweet-page')[0];
            var rate = 0;

            end = x;
            offsetEnd = y;
            rate = (offsetEnd - offsetStart) / (2 * deviceHeight);

            //tool.print(rate);
            easing.pullMotion(page, rate);
        }

    }catch(e){
        alert(e.message);
    }
}

“y - offsetStart”判断事件是否下拉，“document.body.scrollTop == 0”判断滚动条是否在中间。也许它可以帮助你一点点。

于 2013-06-07T10:09:46.140 回答
0

不幸的是，没有简单的答案。最好的方法是构建智能手势识别器。或者使用这样的东西（对于 Safari Mobile）：

http://mud.mitplw.com/JSGestureRecognizer/#single-gesture

您会注意到，当您触摸手势识别器时，没有滚动。但是，您可以使识别器的回调滚动页面。

想知道为什么它只说它支持 Safari 移动版？那是因为 Safari 移动版有自己的一组触摸事件。但是，您可以将其作为开始并尝试添加对其他平台的支持。

于 2012-12-02T01:02:21.147 回答