手机响应式js轮播基础

Posted 不动如山岳 难如知阴阳

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了手机响应式js轮播基础相关的知识,希望对你有一定的参考价值。

onmousedown
--->ontuchstart

onmousemove
--->ontouchmove

onmouseup
--->ontouchend

ontuchstart & ontouchmove & ontouchend 必须通过事件绑定的形式添加;

尽快的把页面呈现给用户:
window.onload ----> 不靠谱;
DOMContentLoaded

clientX ---> ev.targetTouches,是一个列表,使用的时候需要加下标使用;
pageX:算上了scrollL; 在PC端不兼容;
pageY:算上了scrollTop; 在PC端不兼容;

会闪烁:开启硬件加速;
translate3d();

会卡顿:
ev.preventDefault();

只能拖动一次:
事件加给document;

手指抬起[ontouchend]的距离:ev.changedTouches[0].pageX;

 











以上是关于手机响应式js轮播基础的主要内容,如果未能解决你的问题,请参考以下文章

Slick.js使用方法(响应式轮播插件)

5-12《响应式布局》——响应式布局介绍和版心BootStrap使用BootStrap步骤BootStrap入门基础BootStrap案例

JavaScript响应式轮播图插件–Flickity

学生专用网页响应式网页设计动漫主题 bootstrap响应式设计动漫源码分享 附福利网页下载链接

Boostarp-响应式

JavaWeb06-HTML篇笔记