2

我一直在寻找一些代码来帮助我关注光标跟随的页面，周围有一些示例，但这个引起了我的注意：https ://github.com/Goutte/Eye主要是因为它需要的代码很少。

它使用我以前从未见过的 mootools，是否可以将其转换为使用 jQuery，或者有人可以准确地解释它是如何使用这么少的 javascript 工作的？mootools 内置了哪些功能，让这一切变得如此简单？

JsFiddle：http: //jsfiddle.net/B2Nza/46/

var options2 = {
  socketRadius: 2, // radius of the circle in which the eye's pupil can move
  bindTouchMove: true,
}

var leftEye2  = new Eye ('left_eye2', options2);
var rightEye2 = new Eye ('right_eye2', options2);

var fly2 = new Eye ('fly2', {
    socketRadius: 17,
    behavior: 'follow',
    stickToSocket: true
});
4

1 回答 1

4

以下是使用 JavaScript 的方法。

var element = document.getElementById("leela-eye");
document.addEventListener("mousemove", function (event) {
    var x = event.pageX;
    var y = event.pageY;   
    var offsets = eye.lens.getBoundingClientRect();
    var left = (offsets.left - x)
    var top = (offsets.top - y)
    var rad = Math.atan2(top, left);
    element.style.webkitTransform = "rotate(" + rad + "rad)";
});

js小提琴。

如果您的浏览器不支持将弧度传递给，则可以将其转换为度数（并在属性值中rotate()交换）。raddeg

var deg = rad * (180 / Math.PI);
于 2013-07-21T11:36:37.477 回答