title: How to fix jumping / snapping CSS Hover effect in MS Edge
body: <p>I'm experiencing a weird phenomenon using Microsoft Edge (40.15063.674.0) / Microsoft EdgeHTML (15.15063) with the code below. As expected, when you hover over the black box with any browser, it smoothly scales the box to 1.25x its size over 0.5 seconds. The problem happens when a mouse is moving too fast across the box in Edge. What happens is that instead of scaling smoothly, the box jumps/snaps to the desired transformation and then back again. Let’s say a user was moving their mouse fast from one side of the screen to the other and “cutting across the lawn” so to speak across the surface of the box. </p>
  
  <p>In fact, if I move too fast in other browsers, the box doesn't attempt to scale at all. It just stays small unless the mouse movement actually ends up stopping in that area. Even in Internet Explorer this works just fine with as fast as I can move the mouse pointer across it, but only in Edge do I find this behavior. I have to go relatively slow to prevent that jitter-like snap. It doesn't matter what the effect is either. It could be a "scale", a "translateY", etc. If the mouse is moving too fast across the ":hover" it's not smooth in Edge. Is this a known issue? Is there anything I could do to prevent this from happening?</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  
  &lt;style&gt;
  
      .box {
          background-color: #000;
          cursor: pointer;
          position: absolute;
          left: 200px;
          top: 200px;
          height: 200px;
          width: 200px;
          transition: transform 0.5s;
          transition-delay: 0.1s;   &lt;=== Added this to stop it from jumping
      }
  
      .box:hover {
          transform: scale(1.25);
      }
  
  &lt;/style&gt;
  
  &lt;div class="box"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I've even tried replicating the effect using jQuery's ".hover" function to add the CSS attributes when the mouse enters and then take them away when the mouse leaves but to no avail. It behaves exactly the same way. The hover effect jumps/snaps if the mouse is moving too fast in Edge.</p>