Глаза следуют указателю мыши Mootools -> JQuery

Я искал какой-то код, который помог мне сделать глаза на странице, следуя курсору, есть несколько примеров, но этот ловушка попал мне в глаза: https://github.com/Goutte/Eye главным образом потому, что он требует так мало кода ,Глаза следуют указателю мыши Mootools -> JQuery

Он использует 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 
});

источник

2013-02-12 mao

Объект прототипа глаз не определен в Mootools, она определяется здесь: https://raw.github.com/Goutte/Eye/master/Source/Eye.js –

@AndrewMoore хорошо я чувствую себя довольно глупо сейчас, я не вижу, чтобы это было связано где-нибудь в jsfiddle? – mao

Если вы хотите jquery, возможно, посмотрите на это: http://www.senamion.com/blog/jeye.html – gulty

Вот как вы можете сделать это с помощью 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)"; 
});

jsFiddle.

Если вы не поддерживаете передачу радианов на rotate(), вы можете преобразовать их в градусы (и обмен rad с deg в стоимость недвижимости).

var deg = rad * (180/Math.PI);

источник

2013-07-21 11:36:37 alex

Глаза следуют указателю мыши Mootools -> JQuery

ответ

Смежные вопросы