title: Stopping the $timeout - AngularJS
body: <pre><code>var app = angular.module('myapp', []);
  
  app.controller('PopupCtrl', function($scope, $timeout){
  $scope.show = 'none';
  
  
    $scope.mouseover = function(){
      console.log('Mouse Enter');
      $scope.show = 'block';
    };
  
    $scope.mouseout = function(){
  
         console.log('Mouse Leave');
          var timer = $timeout(function () {
            $scope.show = 'none';
          }, 2000);
  
  
    };
  
  });
  </code></pre>
  
  <p>When I mouseover a button, a pop up dialog box is show. When I mouseout, the pop up dialog box is going to be hidden in two seconds. The problem come when I mouseover the button for the second time. Even my cursor is still on the button, the pop up dialog box is hide in two second. How to stop the timer when the mouse is over the button again?</p>