javascript 3d 逐侦产品展示(核心精简)
javascript 3d 逐侦产品展示(核心精简)
发布时间:2016-12-30 来源:查字典编辑
摘要:3d逐侦图片素材javascript部分代码复制代码代码如下:varstep=0;varfirst=0;varlth=document.qu...

3d 逐侦图片 素材

javascript 部分代码

复制代码 代码如下:

<span> </span>var step = 0;

var first = 0;

var lth = document.querySelectorAll('#tobj img').length;

window.addEventListener('touchstart',function(e){

e.preventDefault();

first = e.touches[0].pageX;

})

window.addEventListener('touchmove',function(e){

e.preventDefault();

var x = e.pageX || e.touches[0].pageX;

document.getElementById('outs').innerHTML = step;

if(Math.abs(x - first)>10){

document.querySelectorAll('#tobj img')[step].style.display = 'none'

if(x<first){

step++;

if(step>=lth-1){

step =0

}

}else{

step--

if(step<=0){

step = lth-1;

}

}

first = x;

document.querySelectorAll('#tobj img')[step].style.display = 'block'

}

})

window.addEventListener('touchend',function(e){

e.preventDefault();

step = step;

})

核心精简

复制代码 代码如下:

if(Math.abs(x - first)>10){

document.querySelectorAll('#tobj img')[step].style.display = 'none'

if(x<first){

step++;

if(step>=lth-1){

step =0

}

}else{

step--

if(step<=0){

step = lth-1;

}

}

first = x;

document.querySelectorAll('#tobj img')[step].style.display = 'block'

}

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类