Menu
I'm coding my first app in Angular and I came across the problem with mouseenter event. It doesn't work in Chrome at all. Firstly I thought I have a bug in my code but I had checked it in Firefox and everything worked fine. I decided to test some code with mouseenter from jsfiddle and it looks the same - on firefox ok, on chrome not - after mouseenter on li, nothing happens.
Tested code:
<!DOCTYPE html>
<html ng-app="my-app">
<head>
<meta charset="utf-8" />
<style>
/* Put your css in here */
button {
position: relative;
float:right;
top:-40px;
right:0;
}
li {
background: #eee;
padding: 5px;
list-style:none;
width: 200px;
}
</style>
<script src="angular.js"></script>
<script>
var app = angular.module('my-app', [], function () {
})
app.controller('AppController', function ($scope) {
$scope.name = 'World';
})
</script>
</head>
<body ng-controller="AppController">
<p>Hello {{name}}!</p>
<ul>
<li ng-mouseenter="showXBtn = true;
test($event)" ng-mouseleave="showXBtn = false;
test($event)">
<p ng-mouseenter="showXBtn = false;" ng-mouseleave="showXBtn = true;
test($event)">Hide</p>
<button ng-show="showXBtn"><span>x</span></button>
</li>
</ul>
{{showXBtn}}
</body>
</html>
I use AngularJS v1.2.5. Is it a official reported bug ? Or maybe with my chrome is something wrong.. I have the latest version 38.0.2125.111 m. Thanks for any suggestions.
477
asked Jan 01 '26 09:01
I had a similar problem with Chrome and eventually tracked the issue down to a specific Chrome Extension (for me, it was the AngularJS Batarang extension).
If you have any javascript-profiling extensions, the slowness that those add to your page can sometimes cause unusual behavior in events (in particular the mouseenter and mouseleave events).
170
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
