javascript 3d 逐侦产品展示(核心精简)

3d 逐侦图片 素材

javascript 部分代码

<span style="white-space:pre"> </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' 
}