jQuery plugins - hoverIntent
jan 18

hoverIntent

Késleltetett egér események

Verzió: r6
Kiadás dátuma: 2011/02/26
Fejlesztő: Brian Cherne
Liszensz: MIT, GPL

Bevezető

A hoverIntent nem mai gyerek, több projektben használtam már én is, de a www.jquery-plugins.hu oldalon is található plugin, amely alkalmazza ennek a hasznos kis komponensnek az előnyeit...
Ezért is érthetetlen, hogy ez idáig hogyan kerülhette el a boncasztalt!

A pluginnal felhasználóbarátabbá varázsolhatjuk az oldalunkat, azáltal, hogy késleltethetjük az onMouseOver és onMouseOut események meghívását:
ha van egy interaktív elemünk, melyhez saját hover eseményt rendeltünk, akkor ez normális esetben akkor is meghívásra kerül, ha az egeret csak véletlenül húztuk át az említett elem fölött. Ez egy lebomló menü esetén akár zavaró is lehet, de ami ennél is fontosabb, hogy ha az Over (és természetesen az Out) eseményhez összetett, komplex függvények csoportja kötődik, akkor azok feleslegesen futnak le egy véletlen felhasználói mozdulat következtében, ez pedig a kliens gép erőforrásainak indokolatlan pocsékolását eredményezi (rosszabb esetben a gyengébb gépeket látványosan be is lassíthatja).

A hoverIntent segítségével megadhatjuk, hogy mennyi idő elteltével hajtódjanak végre a függvényhívások Over és Out események kapcsán, ezáltal kiküszöbölve a "véletlen" felhasználói műveletekből adódó felesleges függvényhívásokat.

Implementálás

JavaScript

            <script type="text/javascript" src="js/jquery.js"></script>
            <script type="text/javascript" src="js/jquery.hoverIntent.minified.js"></script>
          

Deklaráció

            $(document).ready(function(){
              $('#pelda').hoverIntent(functionOver, functionOut);
            });
          

Teljes paraméterlista

  • over: függvényhívás onMouseOver eseményhez (kötelező paraméter!)
  • out: függvényhívás onMouseOut eseményhez (kötelező paraméter!)
  • interval: késleltetés milliszekundumban az over függvény meghívása előtt. Amennyiben az egér elmozdul a célterületről a paraméterben megadott időn belül, akkor nem kerül meghívásra az over függvény (és természetesen az out függvény sem fut le!) (alapértelmezett: 100)
  • timeout: késleltetés milliszekundumban az out függvény meghívása előtt: amennyiben az egér visszatér a célterület fölé még a paraméterben megadott időn belül, akkor nem kerül meghívásra az out függvény (és természetesen az over függvény sem fut le még egyszer!) (alapértelmezett: 0)
  • sensitivity: a plugin érzékenysége az egér mozgására, képpontban megadva. Ha a minimálisan választható 1-et adjuk értékül, akkor az over függvény csak abban az esetben fut le, ha az egérmutató nem mozdul meg a célterület fölött az interval paraméterben megadott időn belül (nagyobb érték esetén hamis eredményt kaphatunk!) (alapértelmezett: 7)