javascript - 使用 Css 和 jQuery 移动背景图像

Question

我想做一个背景图片(比页面大)定位 当鼠标移到它上面时我做到了，但我希望移动时那样 鼠标位置相对于图像位置没有改变

即在下面的示例中，如果鼠标悬停在一个字母上，当移动 鼠标停留在同一个字母上的背景图片

但百分比不正确

var newvalueX = e.pageX / $(window).width() *100;
var newvalueY = e.pageY / $(window).height() *100;

这里的工作示例:https://codepen.io/anon/pen/pazzZG/

有什么想法吗？ 谢谢!

Answer 1

根本不要使用百分比。跟踪上一个 mousemove 事件中的鼠标坐标，计算这些坐标与当前事件坐标之间的差值，并将该差值添加到背景的位置。