SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Feb 2011
    Posts
    48
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    jQuery | stop event happening if already over parent element

    I have a problem that suprisingly (not) only affects IE.

    I have a hover/mouseover event when a users cursor enters a div, but because there is text inside my div IE is replaying the event if I hover in/out of the area that has text even though it is in the same div.

    This is what I have:
    Code:
    $('.reason-1').mouseover(function(){		
    		$('#first-r').stop(true, true).fadeIn(600);			
    		$('#first-r-info').stop(true, true).delay(400).fadeIn(800);		
    	});	
    	$('.reason-1').mouseout(function(){		
    		$('#first-r').fadeOut(1000);			
    		$('#first-r-info').fadeOut(400);		
    	});
    Code:
    <ul class="reasons">
    
    <li class="reason reason-1">
    <h3>Title</h3>
    <p>Summary text area</p>
    
    <div class="overlaytxt"><a href="link" class="reason-over-link">&nbsp;</a></div>
    </li>
    
    etc...
    </ul>
    So my quest how can I stop IE playing the action again if the user is still inside the same list element?

    Any help is really apprciated, thanks

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,696
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by sheferd View Post
    So my quest how can I stop IE playing the action again if the user is still inside the same list element?
    quest? Let's do this in the spirit of The Internet Oracle

    Dear supplicant, your quest can come to an end as there is an answer that can fulfill this long wanted need.
    jQuery provides some events called .mouseenter() and .mouseleave() that can solve the problem you are facing.

    Go forth now with this knowledge and use it only for the purposes of good.
    You owe the Oracle flameproof underwear.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Enthusiast
    Join Date
    Feb 2011
    Posts
    48
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Haha!, thanks for the reply, it was supposed to say 'question' but I only noticed after it was too late to edit. Thanks though I'll give this a try later today and let you know how it goes.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •