学习目标:
触屏事件概述:
移动端浏览器兼容性较好,我们不需要考虑以前JS的兼容性问题,可以放心的使用原生JS的书写效果,但是移动端也有自己独特的地方,比如触屏事件touch(也称触摸事件),Android...touch对象代表一个触摸点,触摸点可能是一根手指,也可能是一根触摸笔.触屏事件可相应用户手指(或触控笔),对屏幕或者触控板操作
常见的触屏事件如下:
试着写一下,切换成模拟手机调试
再来试试触摸滑动事件...,就是说本来我只想拖动盒子,但是 整个页面都滚动起来了....因为是移动端,所以可以使用CSS3的一些方法:
这样移动的话ul就不用加定位了
现在试做一下:
后面接着做无缝滚动
因为是ul在做过渡效果,所以我们给ul添加一个监听事件:
我们让他过渡完成后就打印一个...11
往左划也一样,但是现在还没做拖动效果
下面要做小圆点跟随图片变化的效果,也引出了新的知识点:
classList属性
classList属性是HTML5新增的一个属性,返回元素的类名