Solved

mouseenter with delay jquery

Posted on 2014-03-13
4
618 Views
Last Modified: 2014-03-13
Hi,

I want to use the mouseenter in jquery but only occurs if the mouse stay entered in a element , in my case a td, for more than 3 seconds, my problem is that occurs inmediately after the mouse enters over the td, any idea?
0
Comment
Question by:joyacv2
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 39927582
Suggest you look at the hoverintent plugin
http://cherne.net/brian/resources/jquery.hoverIntent.html

Saves messing around with timeouts
0
 
LVL 110

Expert Comment

by:Ray Paseur
ID: 39927674
No points for this comment, please, but I'd just like to vote up the use of something like this with a little delay.  It has to be one of the smarter UX designs I've seen in a long time.  It's amazingly annoying when you have to move the mouse over a piece of the navigation and all the flyouts jump all over the screen.  With hoverIntent, it looks like you can give the client a break from all that.  Great suggestion!
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 39927708
With your own timer : http://jsfiddle.net/XmsBc/

var _in = function() {
    var dis = this;
    var t = setTimeout(function() {
                $(dis).removeData("timer");
                $(dis).addClass("active")
    }, 3000);
    $(this).data("timer",t);
}

var _ot = function() {
    if($(this).data("timer")) {
        clearInterval($(this).data("timer"));
        $(this).removeData("timer");
    }
    $(this).removeClass("active")
}

$("td").hover(_in,_ot);

Open in new window

0
 
LVL 1

Author Closing Comment

by:joyacv2
ID: 39927733
perfect!!!
0

Featured Post

Cloud Training Guides

FREE GUIDES: In-depth and hand-crafted Linux, AWS, OpenStack, DevOps, Azure, and Cloud training guides created by Linux Academy instructors and the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Build an array called $myWeek which will hold the array elements Today, Yesterday and then builds up the rest of the week by the name of the day going back 1 week.   (CODE) (CODE) Then you just need to pass your date to the function. If i…
How to build a simple, quick and effective accordion menu using just 15 lines of jQuery and 2 css classes
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn how to dynamically set the form action using jQuery.

627 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question