移动端事件的学习整理

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库的引用  按照上面基本格式写代码导入相应的参数得到对应的效果

是一个很好的学习库

你可能感兴趣的:(移动端事件的学习整理)