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

2014-03-26 7

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' 
}
展开阅读全文

更多Javascript文章

JavaScript OOP面向对象介绍
Dec 02 9
jquery 插件学习(三)
Aug 06 9
利用a标签自动解析URL分析网址实例
Oct 20 6
js两种拼接字符串的简单方法(必看)
Sep 02 10
更靠谱的H5横竖屏检测方法(js代码)
Sep 13 12
js定时器实现倒计时效果
Nov 05 11
Nuxt项目支持eslint+pritter+typescript的实现
May 20 7
手机访问当前页面