移动端事件的学习整理
1.localStorage sessionStorage
2.移动端的事件
3.swiper库的引用(轮播图的应用)
一. localStorage sessionStorage
localStorage sessionStorage 用法都相同
和cookie一样都能存储一些数据在服务器硬盘上 但存储的容量比cookie要大
都有 获取getItem() 写入setItem() 删除removeItem() 删除所有 clear() 四种方法
前者数据是永久保存的除非自己删除 后者关闭页面就会删除
二. 移动事件
1.orientationchange 设备的横竖屏的切换 并做了一个css一个小demo
学习到用link引入 减少dom操作 节省性能提高加载的效率
正常是0° 左转和右转都是90°
2.触摸事件
1.touchstrat 手指放到屏幕的时候触发
2.touchmove 手指在屏幕上移动的时候触发
3.touchend 手指离开屏幕的时候触发
4.touchcancel 非主观意义上的手指移开 手机来电显示等打断
5.移动端的拖拽 和pc端是使用方法差不多
注意的点手指不确定有多少个 我们得确定一个目标来确定来作为点击的操作箭头
var aTouch = ev.touches[0]
3.手势事件
1.gesturestart 两个手指放入的时候触发
2.gesturechange 任意一个手指发生改变的时候触发
3.gestureend 任意一个手指离开屏幕的时候触发
4.event.scale 放大的比例 event.rotation 旋转的方向
4.touchjs.min.js使用
固定格式 touch.on(事件目标,方法名,函数)
注意的点是得确定事件在屏幕上移动了多少
用x,y来表达横向纵向的变化
先在外面定义x =0 y=0 初始位置 后面改变的时候再等值就可以记录当前变换量
三.swiper库的引用 按照上面基本格式写代码导入相应的参数得到对应的效果
是一个很好的学习库