search

DmitryBaranovskiy / raphael

JavaScript Vector Library
https://dmitrybaranovskiy.github.io/raphael/
MIT License
11.26k stars 1.67k forks source link

Raphael 1.2.4: mouseover fires continuously in IE when toFront() called #95

Closed gvt closed 14 years ago

gvt commented 14 years ago

Raphael version 1.2.4 has a bug where the mouseover event handler is called INFINITE times in the Internet Explorer browsers (confirmed in IE6; possibly an issue in IE7 and IE8).

This can be confirmed by running the following code in the Raphael playground (http://raphaeljs.com/playground.html)

var c = paper.circle(320, 240, 60).animate({fill: "#223fa3", stroke: "#000", "stroke-width": 80, "stroke-opacity": 0.5}, 2000);
c.mouseover(function(){ alert('on'); c.toFront() });

Run this code in the playground (link above), and then put the mouse over the circle. On Windows in IE, you will see the alert continuously for as long as your mouse is over the circle. On the Mac platform -- Firefox and Safari -- you will see the alert box 1 time. Chrome on Windows is better, showing the alert box 2 times (which is still a bug, see other bug here http://github.com/DmitryBaranovskiy/raphael/issues/#issue/94). Firefox on Windows works correctly, showing the alert box 1 time.

DmitryBaranovskiy commented 14 years ago

fixed

renatoi commented 12 years ago

This issue is still happening for me. If you use your spacebar or enter key to get rid of the alert box (instead of clicking OK), you will see the mouse over event keeps firing the alert box continuously. Can someone reopen this bug please?

joshkeller commented 12 years ago

I ran into this issue in IE7, IE8, and IE9 when using Raphael 2.0.2.

The example given in the first message in this thread still generates the error. Happy to set up another test case if that's helpful.

alanomaly commented 12 years ago

Me too, in IE7,8,9 as above and also IE6.

Here's a clearer example.

var c = paper.circle(320, 240, 60).attr({fill: "#000000",stroke:"#222222",'stroke-width':25}); c.mouseover(function(){ c.attr('opacity',c.attr('opacity')*0.90); c.toFront(); }); c.mouseout(function(){ c.attr('opacity',1); });

Non-IE: opacity goes down once each time you mouse over. IE: opacity fades constantly during hover.

Also, probably related, mouseout often breaks when calling toFront() inside hover only in IE. You can also see this in the above example. Seems like in IE, when toFront() re-orders the DOM, in some way it doesn't register the object as being the same after being moved (surprising that IE9 is the same as VML-only IEs)

EDIT looks like this is related to issue #225