栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

跨浏览器标准化鼠标滚轮速度

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

跨浏览器标准化鼠标滚轮速度

鉴于:

  • 过去,OS X上同一浏览器的不同版本产生了不同的价值,将来可能会产生不同的价值,
  • 在OS X上使用触控板产生的 效果 与使用鼠标滚轮产生的 效果 非常相似,但事件 却大不相同,并且JS无法检测到设备差异

…我只能建议使用以下基于符号的简单计数代码:

var handleScroll = function(evt){  if (!evt) evt = event;  var direction = (evt.detail<0 || evt.wheelDelta>0) ? 1 : -1;  // Use the value as you will};someEl.addEventListener('DOMMouseScroll',handleScroll,false); // for FirefoxsomeEl.addEventListener('mousewheel',    handleScroll,false); // for everyone else

最初的尝试是正确的。

这是我第一次尝试对值进行规范化的脚本。它在OS X上有两个缺陷:OS X上的Firefox生成的值应为应有值的1/3,而OS
X上的Chrome生成的值应为应有值的1/40。

// Returns +1 for a single wheel roll 'up', -1 for a single roll 'down'var wheelDistance = function(evt){  if (!evt) evt = event;  var w=evt.wheelDelta, d=evt.detail;  if (d){    if (w) return w/d/40*d>0?1:-1; // Opera    else return -d/3;   // Firefox;         TODO: do not /3 for OS X  } else return w/120;  // IE/Safari/Chrome TODO: /3 for Chrome OS X};

编辑 :@Tom的一个建议是简单地将每个事件调用计为一次移动,并使用距离的符号对其进行调整。在OS
X上平滑/加速滚动时,这不会产生很好的效果,也不能很好地处理鼠标滚轮快速移动(例如

wheelDelta
240)的情况,但是这种情况很少发生。由于此处描述的原因,现在该代码是此答案顶部显示的推荐技术。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/464712.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号