一、移動(dòng)端touch事件
- 當(dāng)用戶手指放在移動(dòng)設(shè)備在屏幕上滑動(dòng)會(huì)觸發(fā)的touch事件
- touchstart: 當(dāng)手指觸碰屏幕時(shí)候發(fā)生(不管當(dāng)前有多少只手指)
- touchmove: 當(dāng)手指在屏幕上滑動(dòng)時(shí)連續(xù)觸發(fā)
- touchend: 當(dāng)手指離開(kāi)屏幕時(shí)觸發(fā)
- touch事件包含三個(gè)觸摸列表(實(shí)現(xiàn)多點(diǎn)觸控)
- touches：當(dāng)前位于屏幕上的所有手指的列表
event.touches[0].clientX
- targetTouches：位于當(dāng)前DOM元素上的手指列表
- changedTouches ： 涉及當(dāng)前事件手指的列表
event.touches[0].clientX
- 觸摸點(diǎn)包含觸摸信息(常用)
- clientX：觸摸目標(biāo)在視口中的x坐標(biāo)
- clientY：觸摸目標(biāo)在視口中的y坐標(biāo)
- identifier：標(biāo)識(shí)觸摸的唯一ID
- pageX：觸摸目標(biāo)在頁(yè)面中的x坐標(biāo)
- pageY：觸摸目標(biāo)在頁(yè)面中的y坐標(biāo)
- screenX：觸摸目標(biāo)在屏幕中的x坐標(biāo)
- screenY：觸摸目標(biāo)在屏幕中的y坐標(biāo)
- target：觸目的DOM節(jié)點(diǎn)目標(biāo)
- 移動(dòng)端click屏幕產(chǎn)生200-300 ms的延遲響應(yīng)
移動(dòng)瀏覽器為什么會(huì)設(shè)置300毫秒的等待時(shí)間呢若治？這與雙擊縮放的方案有關(guān)把还。平時(shí)我們有可能已經(jīng)注意到了，雙擊縮放镊叁，即用手指在屏幕上快速點(diǎn)擊兩次渴邦，可以看到內(nèi)容或者圖片放大，再次雙擊澎剥，瀏覽器會(huì)將網(wǎng)頁(yè)縮放至原始比例锡溯。
瀏覽器捕獲第一次單擊后，會(huì)先等待一段時(shí)間哑姚，如果在這段時(shí)間區(qū)間里用戶未進(jìn)行下一次點(diǎn)擊趾唱，則瀏覽器會(huì)做單擊事件的處理。如果這段時(shí)間里用戶進(jìn)行了第二次單擊操作蜻懦，則瀏覽器會(huì)做雙擊事件處理甜癞。這段時(shí)間就是上面提到的300毫秒延遲。
移動(dòng)端click事件和PC端的click是完全不一樣的的!!!
二宛乃、SwiperJS
Swiper是純javascript打造的滑動(dòng)特效插件悠咱，面向手機(jī)蒸辆、平板電腦等移動(dòng)終端,Swiper能實(shí)現(xiàn)觸屏焦點(diǎn)圖、觸屏Tab切換析既、觸屏多圖切換等常用效果;
