Top-Themen

Aktuelle Themen (A bis Z)

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit

gelöst Mouseenter muss für zwei Sekunden bestehen

Mitglied: Boingboing

Boingboing (Level 1) - Jetzt verbinden

10.11.2011, aktualisiert 09:43 Uhr, 4477 Aufrufe, 2 Kommentare

Hi,

habe ein kleines Problem mit meinem JS/jQuery Script

Ich habe eine Bar an der Oberseite, die bei mouseenter runterfährt und bei mouseleave wieder hochfährt. Soweit so gut. Desweiteren hab ich noch eine mouseover die das Geschwindigkeitsverhalten der Bar steuert.

Funktioniert soweit alles, stehe nun aber vor einem kleinen Problem.

Ich möchte, dass das mouseenter erst gefeuert wird, wenn der Benutzer sich für ein oder zwei Sekunden innerhalb des Divs aufhält.

Hier sind mal meine Drei funktionen die ich verwende

Die mouseenter die fürs runterfahren verantwortlich ist

01.
var slider_state = false;   // slider up/down
02.
var active_slide = false;   // is animation still in process
03.

04.
 $("div#toppanel").mouseenter(function() {
05.
            if(slider_state == false && active_slide == false) {
06.
                active_slide = true;
07.
               $("div#panel").slideDown("300", function() { active_slide = false; } )
08.
            }
09.
         slider_state = true;
10.
    });
Die mouseleave fürs hochfahren
01.
 $("div#toppanel").mouseleave(function() {
02.
        if(slider_state == true && active_slide == false) {
03.
            active_slide = true;
04.
            $("div#panel").slideUp("300", function() { active_slide = false; })
05.
        }
06.
        slider_state = false;
07.
    });
und zuletzt noch die mouseover, die dafür sorgt, dass die bar immer hochfährt wenn man sich irgendwo anders mit der maus befindet
01.
$('#contentwrap').mouseover(function() {
02.
       $("div#panel").slideUp("300", function() { active_slide = false; })
03.
     });
Meine Frage ist nun, wie muss ich die mouseenter umschreiben, dass er ein/zwei sekunden warten und prüft ob die maus sich immernoch innerhalb des divs befindet ?

Danke für eure Hilfe
Mitglied: msr972
10.11.2011 um 12:39 Uhr
Ich hatte ein ähnliches Problem mit einer Sucheingabe Maske, da sonst der $.ajax sofort gefeuert werden würde, jedesmal wenn ich eine Taste drücke.

ich habe das (sicherlich nicht schön aber funktionell) folgendermaßen gelöst:

01.
	var d	= 1000; 
02.
	var st	= null; 
03.
	$("#Filter").live('keydown keypress keyup', function() {
04.
		if(st) {clearTimeout(st);}
05.
	    var type = $("#Filter").attr('rel');
06.
	    switch (type) {
07.
		    case 'getCustomers': st = setTimeout(getCustomers, d); break;
08.
		    case 'getConstructions': st = setTimeout(getConstructions, d); break;
09.
		    case 'getConstructionLoggers': st = setTimeout(getConstructionLoggers, d); break;
10.
		    case 'getConstructionDetails': st = setTimeout(getConDs, d); break;
11.
		    case 'getProducers': st = setTimeout(getProducers, d); break;
12.
		    case 'getModules': st = setTimeout(getModules, d); break;
13.
		    case 'getInverters': st = setTimeout(getInverters, d); break;
14.
		    case 'getLoggers': st = setTimeout(getLoggers, d); break;
15.
	    }
16.
	});
Kurz zur Erläuterung folgende Dinge:
- .live deshalb, da ich die Seite bzw. Teile davon nachlade, sofern also bei Dir alles statisch ist, kannst Du Dir .live sparen
- $("#Filter") ist das entsprechende Feld, dass auf key* actions reagiert und ausgeführt wird
- d stellt den timer dar
- solange eine Taste gedrückt wird, wird praktisch ein setTimeout(-function-) gemacht der dann nach d ms aufgerufen werden würde, ausser es kommt eine neue key* action ins Spiel.

Wiegesagt, quick and dirty und sicherlich nicht optimal, aber für mich hats auf die Schnelle gereicht.
Bitte warten ..
Mitglied: Boingboing
10.11.2011 um 14:21 Uhr
Danke für deinen Beitrag, aber ich habe es folgendermaßen gelöst:

beim mouseenter wirddem toppanel div ne klasse "hasFocus" zugewiesen. Das event wird dann immer mittels setTimeout um x millisekunden verzögert.
bei mouseleave wird dem div immer die klasse "hasFocus" entzogen.

Der Trick ist jetzt, dass innerhalb des setTimeouts nochmals auf die klasse hasFocus geprüft wird.

Hier der Quellcode für interessierte

01.
$("div#toppanel").mouseenter(function() {
02.
        $("div#toppanel").addClass("hasFocus");             //Focus Klasse hinzufügen
03.
        setTimeout(function() {
04.
            if($("div#toppanel").hasClass("hasFocus")) {    //auf Focus Klasse Prüfen
05.
                if(!slider_state && !active_slide) {
06.
                    active_slide = true;
07.
                   $("div#panel").slideDown("300", function() { active_slide = false; } )
08.
                }
09.
                slider_state = true;
10.
            }
11.
        }, 500 );                                       //Timeout in ms
12.
    });
13.

14.
    $("div#toppanel").mouseleave(function() {
15.
        if(slider_state && !active_slide) {
16.
            active_slide = true;
17.
            $("div#panel").slideUp("300", function() { active_slide = false; })
18.
        }
19.
        slider_state = false;
20.
        $("div#toppanel").removeClass("hasFocus");      //Focus Klasse immer entziehen
21.
    });
Danke an Bytelude für seinen Beitrag: Verzögertes MouseOver/Hover mit jQuery
http://bytelude.de/2011/03/30/verzogertes-mouseover-mit-jquery/
Bitte warten ..
Ähnliche Inhalte
Router & Routing
Zwei Switches, zwei VLANs
gelöst Frage von SonneLachtRouter & Routing13 Kommentare

Hallo, ich habe hier eine verzwickte Situation. Ich habe zwei WAN-Anbindungen, jeweils Erstweg und Zweitweg, macht also vier WAN-Router. ...

Router & Routing
Ein Haus, zwei Router, zwei Anbieter
gelöst Frage von 112TimoRouter & Routing11 Kommentare

Hallo Leute, folgendes Problem: meine Eltern sind Kunden bei Kabel Deutschland und ich möchte jetzt zu 1&1 wechseln. Wir ...

Router & Routing

Zwei DSL Leitungen, Zwei Fritzboxen, Zwei Dyndns Accounts - Portweiterleitung klappt nicht

gelöst Frage von caravandriverRouter & Routing4 Kommentare

Hallo, ich habe zwei DSL Leitungen. Eine 100 Mbit (vodafone)und eine 50 Mbit (telekom). An jeder Leitung hängt eine ...

LAN, WAN, Wireless

Zwei Netzwerke Zwei Internetzugänge ein Rechner

gelöst Frage von Oggy01LAN, WAN, Wireless5 Kommentare

Hallo, wie kann man den Internetzugang festlegen, der bei zwei unterschiedlichen Netzwerken auf einem Rechner genutzt werden soll? Intel ...

Neue Wissensbeiträge
Windows Server

Zähe Update-Installation auf Windows Server 2016

Information von kgborn vor 3 StundenWindows Server1 Kommentar

Mir sind in der Vergangenheit immer wieder Beschwerden von Admins unter die Augen gekommen, die sich über die doch ...

Humor (lol)
Turnschuhe per Firmware lahmlegen
Information von Henere vor 6 StundenHumor (lol)3 Kommentare

Und was kommt demnächst ? Bekomme ich kein Klopapier mehr, weil der Spender einem DDOS unterliegt ? :-) Ich ...

Sicherheit

Sicherheitsrisiko in WinRAR und Co. durch Schwachstelle in UNACEV2.DLL

Information von kgborn vor 9 StundenSicherheit

In der seit 2005 nicht mehr aktualisierten Bibliothek UNACEV2.DLL gibt es eine Path-Traversal-Schwachstelle. Diese ermöglicht es, bei ACE-Archiven Dateien ...

Internet

CDU Propaganda: Urheberschutz im Internet - Ende des digitalen Wild-West

Information von Frank vor 1 TagInternet4 Kommentare

Hallo Administratoren, aus einem Kommentar heraus habe ich folgenden Beiträge von Herr Sven Schulze und Axel Voss (beide CDU ...

Heiß diskutierte Inhalte
Hardware
Frage an Kenner von 5,25 Zoll Laufwerken
Frage von DerWoWussteHardware43 Kommentare

Moin Kollegen. Hier wird gerade im Archiv gewühlt und 5,25 Zoll Disketten ("2S/HD", 96TPI) sollen eingelesen werden. Ich habe ...

Datenbanken
PHP Fatal error: Uncaught Error: Call to undefined function oci connect
gelöst Frage von PlanitecXDatenbanken22 Kommentare

Hallo Zusammen, ich sitze seit Tagen am Problem das ich keine PHP Anwendung mit Anbindung zu Oracle zum laufen ...

Hardware
PC im Selbstbau, Workstation, mittelklasse Gaming
gelöst Frage von MrRobot1997Hardware21 Kommentare

Hallöchen Leute, ich bin seit einigen Jahren leider nicht mehr wirklich im Bild, wenn es um die Hardware und ...

Windows Server
User auf Server Install-Rechte geben
gelöst Frage von killtecWindows Server17 Kommentare

Hi, ich möchte auf mehreren W2016 Servern einem bestimmten User das Recht zum Installieren von Programmen geben. Er soll ...