chrome/test/data/mouseleave.html

   1 <html>
   2  <head>
   3   <style>
   4    body {
   5     margin: 0px;
   6     padding: 0px;
   7    }
   8    #mybox {
   9     padding: 20px;
  10     margin: 0px;
  11     border: 1px solid #000;
  12    }
  13    #mystatus {
  14     border: 1px solid #000;
  15     padding: 20px;
  16     margin: 0px;
  17    }
  18   </style>
  19   <script>
  20    var state = '';
  21    var hasLeave = false;
  22    function load() {
  23      state = 'initial';
  24      document.getElementById("mystatus").innerHTML = state;
  25      document.title = "onload";
  26    }
  27    function enter() {
  28      state += ',entered';
  29      document.getElementById("mystatus").innerHTML = state;
  30      document.title = "entered";
  31    }
  32    function leave() {
  33      hasLeave = true;
  34      state += ',left';
  35      document.getElementById("mystatus").innerHTML = state;
  36      document.title = "left";
  37    }
  38    function done() {
  39      state += ',done';
  40      document.getElementById("mystatus").innerHTML = state;
  41      document.title = hasLeave ? "with mouseleave" : "without mouseleave";
  42    }
  43   </script>
  44  </head>
  45  <body onload="load()">
  46   <div id="mybox" onmouseover="enter()" onmouseout="leave()"></div>
  47   <div id="mystatus"></div>
  48  </body>
  49 </html>