案例在小窗口浏览器中会出现bug。
来源：4-1 用JS放大镜特效实现
陈辰
2015-12-10 04:40
发现一个bug。求大神解释一下，老师用的offset方法是获取节点相对于body节点边缘的距离。始终是固定值。而获取鼠标位置使用的client方法，是获取鼠标在窗口中的位置，不是相对于body节点边缘的位置。所以，当页面发生滚动之后，鼠标和浮动div会发生错位。也就是说，如果案例中，小图片的位置，如果在第一版面以外，与body节点上边缘距离远大于窗口高度的时候，无论鼠标如何移动，右边大图只会显示最上面一排。同理，如果小图片位置足够靠右，距离远大于窗口高度的时候，右边的大图，无论鼠标如何移动，只能显示左上角区域，所有代码成了摆设。
所以老师，一个浏览器都没搞定，还教我们跨浏览器兼容？
写回答
关注
2回答
-
- 陈辰
- 2015-12-12 08:19:13
已经解决了。document.body.scrollLeft方法可以获取已经滚动过的距离，加载鼠标坐标上就可以了。
-
- echo_kinchao
- 2015-12-10 09:12:56
可能这是老师没有考虑到的吧
用JS实现放大镜特效
让图片看起来更美观，同时课程中详细介绍了JavaScript相关的知识点
30101 学习 · 108 问题
相似问题