Forum PHP.pl > [mootools] zatrzymanie opóźnionego zdarzenia

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [mootools] zatrzymanie opóźnionego zdarzenia

Forum PHP.pl > Forum > Po stronie przeglądarki

cichy380

20.01.2011, 11:12:53

proszę o pomoc przy poniższym kodzie,

powoduje on wyświetlenie komunikatu (przykładowa akcja) po najechaniu na element (zdarzenie),
akcja wykonuje się z opóźnieniem 2sek

[JAVASCRIPT] pobierz, plaintext 
  var fAkcja = function(){
    alert('wyświetlam komunikat!');
  }
 
  $('idDivElement').addEvent('mouseenter', function(){  // akcja wywoływana po najechaniu kursorem na element o ID "idDivElement"
    fAkcja.delay(2000);
  })
[JAVASCRIPT] pobierz, plaintext

kod działa, ale... chciałbym aby akcją się nie wywoływała w przypadku gdy kursor opuści element przed upływem 2sek,
czyli chodzi o zatrzymanie / przerwanie akcji w momencie opuszczenia elementu przez kursor.

skowron-line

20.01.2011, 11:34:41

addEvents + mouseenter, mouseleave + cancel

cichy380

20.01.2011, 11:41:27

Cytat(skowron-line @ 20.01.2011, 11:34:41 )

addEvents + mouseenter, mouseleave + cancel

nie działa

zwraca: fAkcja.cancel is not a function

zrobiłem tak:

[JAVASCRIPT] pobierz, plaintext 
  var fAkcja = function(){
    alert('wyświetlam komunikat!');
  }
 
  $('idDivElement').addEvent('mouseenter', function(){ // akcja wywoływana po najechaniu kursorem na element o ID "idDivElement"
    fAkcja.delay(2000);
  })
 
  $('idDivElement').addEvent('mouseleave', function(){ // akcja wywoływana po zdjęciu kursora z elementu o ID "idDivElement"
    fAkcja.cancel();
  })
[JAVASCRIPT] pobierz, plaintext

thek

20.01.2011, 12:08:33

A nie powinno być po prostu:

[JAVASCRIPT] pobierz, plaintext 
$('idDivElement').addEvent( 'mouseleave', $clear(fAkcja) );
[JAVASCRIPT] pobierz, plaintext

?
Nie używam i nigdy nie używałem MooTools. Użyłem google i dokumentacji

http://docs111.mootools.net/#$clear

cichy380

20.01.2011, 12:14:06

Cytat(thek @ 20.01.2011, 12:08:33 )

A nie powinno być po prostu:

[JAVASCRIPT] pobierz, plaintext 
$('idDivElement').addEvent( 'mouseleave', $clear(fAkcja) );
[JAVASCRIPT] pobierz, plaintext

nie zadziałało,

ale chyba sobie poradziłem,
zrobiłem:

[JAVASCRIPT] pobierz, plaintext 
  var timer;
 
  var fAkcja = function(){
    alert('wyświetlam komunikat!');
  }
 
  $('idDivElement').addEvent('mouseenter', function(){ // akcja wywoływana po najechaniu kursorem na element o ID "idDivElement"
    $clear(timer)
    timer = fAkcja.delay(2000);
  })
[JAVASCRIPT] pobierz, plaintext

thek

20.01.2011, 13:04:33

Swoją drogą patrząc na same docs to widzę, że można by to skrócić do

[JAVASCRIPT] pobierz, plaintext 
var fAkcja = function(){ alert('wyświetlam komunikat!') }.delay(2000);
$('idDivElement').addEvent('mouseenter', fAkcja);
$('idDivElement').addEvent('mouseleave', $clear(fAkcja) );
[JAVASCRIPT] pobierz, plaintext

Od razu mówię... Z MooTools to mój pierwszy w życiu skrypt i to napisany tylko na podstawie dokumentacji, bez uruchomienia i przetestowania gdziekolwiek

EDIT:

Twój nie działa gdy wyjdziesz i poczekasz, bo brak mouseleave zdefiniowanego. Weź to co poniżej. Właśnie sobie skrypt przetestowałem...

[JAVASCRIPT] pobierz, plaintext 
var timer;
var fAkcja = function(){ alert('wyświetlam komunikat!') };
$('idDivElement').addEvent('mouseenter', function() { timer = fAkcja.delay(2000) });
$('idDivElement').addEvent('mouseleave', function() { $clear(timer) } );
[JAVASCRIPT] pobierz, plaintext

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.