1***@qq.com
1***@qq.com
  • 发布:2018-03-20 17:49
  • 更新:2018-03-21 15:22
  • 阅读:1558

请问怎么才能做到像banner一样的触摸滑动效果,我这个在有的手机上面没有拖动的感觉

分类:HTML5+
    touchBox("swiperBoxnb");  
    var wwin = $(window).width();  
    var leng = $(".choice-box").length;  
    var a = 0;  
    var disX = 0;  
    var disY = 0;  
    function touchBox(id){  
        var obj = document.getElementById(id);  
        obj.addEventListener('touchstart', function(event){  

// event.preventDefault();
// 如果这个元素的位置内只有一个手指的话
if(event.targetTouches.length == 1){
var touchBox = event.targetTouches[0];
// 把元素放在手指所在的位置
disX=touchBox.pageX;
disY=touchBox.pageY;
obj.addEventListener('touchmove',move);

                obj.addEventListener('touchend',chend);  

            };   
        },false);  
    }  

    function move(event){  

// document.documentElement.style.touchAction = 'none';
var touchBox2=event.targetTouches[0];
var l=touchBox2.pageX-disX;
$(".swiper-box-nb").css("left",l);
};

    function chend(event){  

// document.documentElement.style.touchAction = 'none';
var touchBox3=event.changedTouches[0];
var l2=touchBox3.pageX-disX;
if(l2<-10&&a<leng){
a++;
// alert(a + " " + l2);
var x = awwin;
$(".swiper-box-nb").animate({left:-x});
}else if(l2>10){
a--;
// alert(a + " " + l2);
var x = a
wwin;
if(a>=0){
$(".swiper-box-nb").animate({left:-x});
}else{
$(".swiper-box-nb").animate({left:0});
}
}
};

2018-03-20 17:49 负责人:无 分享
已邀请:
1***@qq.com

1***@qq.com (作者) - 前端开发

我想要写一个页面滑动事件,页面里面还要有横向滑动效果

该问题目前已经被锁定, 无法添加新回复