Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Incorrect behaviour when entering <html> (instead of leaving) #38

Closed
s16h opened this issue May 29, 2014 · 7 comments
Closed

Incorrect behaviour when entering <html> (instead of leaving) #38

s16h opened this issue May 29, 2014 · 7 comments

Comments

@s16h
Copy link

s16h commented May 29, 2014

If you load the page when the mouse pointer is still in the bar of the browser (say, on the address field) and after the page is loaded you moved the mouse onto the page to start looking at the website (as you do), the modal will get activated (at least that's the behavior in Chrome Version 34.0.1847.116 m on Windows 7).
I think instead of mouseout, mouseleave should be used.

@bergerjac
Copy link
Contributor

agreed. same behavior on Firefox 29.0.1, Windows 7 x64

@carlsednaoui
Copy link
Owner

Thanks @s16h, we can look into mouseleave and update the code if makes sense. I think this issue addresses something similar to what you're mentioning: #26 but we didn't look into mouseleave at the time.

Have you have a chance to run the script with mouseleave on your end? Does this solve the problem?

/cc: @bergerjac

@s16h
Copy link
Author

s16h commented May 29, 2014

I haven't tried yet. I'm going to fork and try to fix this later today (or possibly over the weekend).

@jescalan
Copy link
Contributor

👍

@s16h s16h changed the title Incorrect behavior when entering <html> and not leaving Incorrect behaviour when entering <html> (instead of leaving) May 29, 2014
@bergerjac
Copy link
Contributor

According to MDN example, which illustrates the difference between mouseout and mouseleave events

mouseout fires when the cursor moves off the element and onto another, including firing when moving between children (current implementation)

mouseleave fires when the cursor moves completely off of the element and its tree

using only mouseleave seems like it would provide the intended behavior

  1. open Dev Tools on this page
  2. open console
  3. paste this snippet (which selects the whole comment section)
  4. note behavior when hovering around the page, within the comments, etc.
  5. reload page
  6. replace mouseout with mouseleave
  7. repeat hover test
var test = document.getElementById("discussion_bucket");  
  test.addEventListener("mouseout", function( event ) {   
    event.target.style.color = "red";
    setTimeout(function() { event.target.style.color = ""; }, 2000);
  }, false);

@carlsednaoui
Copy link
Owner

This is great @bergerjac! Here's another way to test:

Mouseout

$('body').on('mouseout', function(e) {console.log('out')});

Mouseleave

$('body').on('mouseleave', function(e) {console.log('leave')});

Want to submit a PR?

bergerjac added a commit to bergerjac/ouibounce that referenced this issue May 30, 2014
…ates to contributing;

 - Issue carlsednaoui#38 carlsednaoui#38 explains why the change from mouseout to mouseleave
bergerjac added a commit to bergerjac/ouibounce that referenced this issue May 30, 2014
…ates to contributing;

 - Issue carlsednaoui#38 carlsednaoui#38 explains the change from mouseout to mouseleave
@carlsednaoui
Copy link
Owner

Closed with #45

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants