src/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    function load() {
  22      state = 'initial';
  23      document.getElementById("mystatus").innerHTML = state;
  24      document.title = "onload";
  25    }
  26    function enter() {
  27      state += ',entered';
  28      document.getElementById("mystatus").innerHTML = state;
  29      document.title = "entered";
  30    }
  31    function leave() {
  32      state += ',left';
  33      document.getElementById("mystatus").innerHTML = state;
  34      document.title = "left";
  35    }
  36   </script>
  37  </head>
  38  <body onload="load()">
  39   <div id="mybox" onmouseover="enter()" onmouseout="leave()"></div>
  40   <div id="mystatus"></div>
  41  </body>
  42 </html>