当鼠标在.mousemove DIV上移动时,将显示.show DIV,然后,如果鼠标在3秒钟内未移动,则.show DIV将消失。
<div class="mousemove" ng-mousemove="myToggle()" ng-model="loading" ></div>
<div class="show" ng-show="loading"></div>
$scope.myToggle = function() {
$scope.loading = true;
$timeout(
function() {
$scope.loading = false;
},
3000);
}
我做了些什么,但是当我不断在.mousemove DIV上移动鼠标时,.show DIV会闪烁。该怎么办,我是AngularJS的新手。这是我的演示:http : //embed.plnkr.co/WbhqAQ4JJvOfuCN4tI3I/preview
如果$ timeout已经在运行,则可以在重新启动之前取消它。
var myApp = angular.module('myApp',[]);
myApp.controller('myController', function($scope, $timeout) {
$scope.myToggle = function() {
// Check to see if there already is a $scope.loading timer
if($scope.loading){
// if there is then use the $timeout.cancel() method
$timeout.cancel($scope.loading);
}
// Initialize the $timeout into the $scope.loading propert
$scope.loading = $timeout(
function() {
$scope.loading = false;
}, 3000);
}
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句