请选择 进入手机版 | 继续访问电脑版

zepto 鼠标指针活动事件解决方案

发表于 10-05 16:20 显示全部楼层 16 209

本帖最后由 赵延明老师 于 2017-10-5 16:20 编辑

简介:

       在使用手机端绑定事件,我们首先是zepto.js作为框架解决方案,不过由于谷歌浏览器一直处理更新,使用浏览器模拟手机时多了一种事件类型,这种事件类型称之为 指针活动,不过在于zepto.js在 1.1.6这个版本上没有对其做兼容的更好处理,导致滑屏事件出现各种问题。今天 我们来分享如何解决。

解决办法:

        第一种:禁用自己浏览器的事件:

                1.谷歌浏览器输入 chrome://flags/回车

                2.找到指针活动那一项

                3.先择已停用

        第二种:修改JS框架代码:

                在touch.js中找到pointerup直接 删除

        第三种:在自己的代码当中书写CSS

                在自己的html当中书写CSS body{touch-action:none}

哪种更好:

        上面的解决办法中:

                第一种是解决了自己测试的问题,用户或者同事也需要禁用谷歌 浏览器才能解决,这种方式不好,在最新版本61查不到 指针活动这个选项

                第二种解决了自己和自己认识的同事他们的问题,如果touch.js不是引用你修改过的,是从网上直接下载的,那这样,还是解决不掉,要自己手动修改框架。

                第三种:书写CSS,虽然很简单,但是可以告诉用户或者同事,在手机端要去书写这样一行CSS。这样大家都会统一,这样更简单,高效。这是最好的一种方式。

演示地址:

请回复本帖查看

大家如有问题可以关注微信公众号搜索“赵燕明”或者加入QQ交流群:

小明前端技术交流群二维码.jpg

游客,如果您要查看本帖隐藏内容请回复

想了解更多内容,可以点击以下链接:


小码哥官网:http://www.520it.com/


网页UI学院:http://www.520it.com/special/ui


回复 使用道具
举报
我爱大菠萝

发表于 10-30 10:29 显示全部楼层

回复 支持 反对 使用道具
举报
一鸣

发表于 10-25 19:17 显示全部楼层

回复 支持 反对 使用道具
举报
望断雁南飞

发表于 10-24 20:22 显示全部楼层

回复 支持 反对 使用道具
举报
淡蓝心情

发表于 10-24 19:35 显示全部楼层

好文章,必须帮顶!!!

回复 支持 反对 使用道具
举报
张比亚

发表于 10-24 19:12 显示全部楼层

给楼主32个赞!!!!!

回复 支持 反对 使用道具
举报
magicpapacy

发表于 10-24 18:40 显示全部楼层

回复 支持 反对 使用道具
举报
begeekmyfriend

发表于 10-24 18:28 显示全部楼层

回复 支持 反对 使用道具
举报
卖水果的阿甘

发表于 10-23 12:19 显示全部楼层

必须给个赞!

回复 支持 反对 使用道具
举报
大少女

发表于 10-19 18:48 显示全部楼层

回复 支持 反对 使用道具
举报
12下一页

发表新文章
赵延明老师

小码哥名师团队

0

学分

2303

学币

2573

积分

小码哥名师团队

Rank: 5Rank: 5

积分
2573

签到周冠军勋章小码哥一周年勋章关注小码哥教育公众号意见领袖勋章

Ta的主页 发消息
精华帖排行榜

精彩推荐

  • 关注小码哥教育