2 aaaaykc aaaaykc 于 2015.07.14 10:22 提问

求助,手机qq内置浏览器,javascript问题 20C

function touchMove(event) {

if(event.touches.length > 1 || event.scale && event.scale !== 1 ) return;
var touch = event.targetTouches[0];
endPos = {x:touch.pageX - startPos.x,y:touch.pageY - startPos.y};
isScrolling = Math.abs(endPos.x) < Math.abs(endPos.y) ? 1:0;
clearInterval(auto);
if(isScrolling === 0){
clearTimeout(timeOutEvent);
event.preventDefault();
oUl.style.left = iLeft + endPos.x + 'px';
}
}

function touchEnd(event) {
    if(window.endPos) {
        if( endPos.x < -30  ) {
            oBtnNext.onclick();
        }
        else if( endPos.x > 30  ) {
            oBtnPrev.onclick();
        }
        endPos.x = 0;
    }

    auto = setInterval(oBtnNext.onclick,5000);
    clearTimeout(timeOutEvent);
    oUl.removeEventListener("touchmove", touchMove, false);
    document.removeEventListener("touchend", touchEnd, false);
}

function longPress(){ 
    timeOutEvent = 0;
    return true;
}

}

//自动播放
var auto = setInterval(oBtnNext.onclick, 5000);
oPPager.onmouseover = oBtnPrev.onmouseover = oBtnNext.onmouseover = oUl.onmouseover = function(){
clearInterval(auto);
}
oBtnPrev.onmouseout = oBtnNext.onmouseout = oUl.onmouseout = function() {
auto = setInterval(oBtnNext.onclick, 5000);
}
做了一个移动端跟PC通用的幻灯片效果,别的浏览器都没问题,但是QQ内置浏览器和微信内置浏览器(平板上这个2个内置浏览器又正常...),手指划快一点后,自动播放就会变的飞快,如果拿掉最后的oUl.onmouseout = function() {auto = setInterval(oBtnNext.onclick, 5000);}问题又不会出现,所以我想是不是onmouseout对touchend有影响,请问一下大家,这个该怎么解决。

4个回答

aaaaykc
aaaaykc   2015.07.14 12:22

问题终于解决了,最后把oUl.onmouseout换成onmoudeleave居然就好了

dcxy0
dcxy0   Ds   Rxr 2015.07.14 15:06

学习了。其实我感觉微信内置浏览器上问题很多啊。。。。。,。

showbo
showbo   Ds   Rxr 2015.07.14 17:51

onmouseout如果移动到子元素上也会触发的,需要判断下是否移动到的子元素。mouseleave的话移动到子元素不会触发,只有完全移除这个元素才会触发,所以使用事件的时候也需要注意一下

移动到子容器上触发父容器mouseout事件解决办法

YourBer
YourBer   2015.07.19 10:50

受教了,呵呵!!!!!!

Csdn user default icon
上传中...
上传图片
插入图片