blattertech informatikLukas BlatterNiederlenzerstrasse 21
5600 Lenzburg/AGSwitzerland

079 569 25 90
https://www.blattertech.ch

Adresse anzeigen

jQuery hoverInent - einfach gesteuertes Hovern

3. August 2011 |  JQUERY0 Kommentare

Gestern ist mir das jQuery Plugin hoverIntent über den Weg gelaufen. Mit diesem Plugin lässt sich das Hovern kontrolliert steuern. Die Konfiguration ist sehr einfach:

var config = {
 over: makeTall, // function = onMouseOver callback (REQUIRED)
 timeout: 500, // number = milliseconds delay before onMouseOut
 out: makeShort // function = onMouseOut callback (REQUIRED)
};
$("#demo").hoverIntent( config )
function makeTall(){ $(this).animate({"height":75},200);}
function makeShort(){ $(this).animate({"height":50},200);}

Demo

Der Vorteil dieses Plugins im Vergleich zur normalen Hover funktion liegt darin, dass das Hovern zeitgesteuert kontrolliert werden kann. In der Demo können 4 Boxen gehovert werden. Fährt man schnell mit der Maus darüber, springen nicht alle Boxen auf. Erst nach einer bestimmten Zeit, welche über den Parameter "interval" verändert werden kann, greift das Hovern.

Über den Autor:

Lukas Blatter

bloggt und twittert seit 2009 aus Leidenschaft diverse Themen rund um Webdesign, PHP, TYPO3, CMS Made Simple, Computer und weiteres.

Er ist Gründer und Inhaber von blattertech informatik, Ehemann und Vater einer Kinderschar.

Kommentare

Zurzeit gibt es keine Kommentare zu diesem Artikel.


Auf Grund des hohen Spamaufkommens können zu diesem Beitrag keine Kommentare mehr abgegeben werden