Определить, касается ли мышь элемента, используя Prototype.js? - PullRequest
1 голос
/ 30 января 2012

Я пытаюсь создать приложение Javascript, в котором элемент будет постепенно исчезать, когда мышь к нему прикасается, и исчезать, когда мышь отключена от элемента. Я использую Prototype с Scriptaculous, так есть ли функция Prototype, которая может сказать мне, касается ли мышь какого-либо объекта в любой момент времени?

Моя основная проблема с использованием эффектов Scriptaculous FadeOut / FadeIn заключается в том, что когда один из них запускается до того, как другой завершится, эффекты конфликтуют, а элемент ведет себя неправильно.

1 Ответ

2 голосов
/ 30 января 2012

Просто сохраните объект эффекта где-нибудь (например, в замыкании) и отмените его, если вы хотите применить другой эффект

var element = $("element"),
    currentEffect = null;

element.observe("mouseenter", function() {
    if (currentEffect) {
        currentEffect.cancel();
    }
    currentEffect = new Effect.Fade(element);
});

element.observe("mouseleave", function() {
    if (currentEffect) {
        currentEffect.cancel();
    }
    currentEffect = new Effect.Appear(element);
});

jsfiddle demo

(очевидно, вы можете выполнить рефакторинг несколькими способами, но в основном все, что вам нужно сделать, это наблюдать за событиями mouseenter и mouseleave, и не забудьте отменить любой запущенный эффект перед запуском нового)

...