JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
<html>
<head>
</head>
<body>
    <p>Hover over a box until it turns red, then</p>
    <p>Scroll the page until the cursor is no longer over the red box.</p>
    <p>Be careful not to move the mouse when scrolling the page. Use arrow keys, trackpad or scroll wheel instead.</p>
    <p>What happens? In Chrome 11.0.696.71 on OSX, mouseenter and mouseleave do not fire and the hover state does not update.</p>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div...

CSS

body {
    background-color: #fff;
}

.tile {
    width: 64px;
    height: 64px;
    margin: 8px;
    display: inline-block;
    background-color: #eee;
}

.focused {
    background-color: red;
}

p {
    width: 50%;
    margin: 1em;
}

JavaScript

$(function(){

    $('.tile')
        .bind('mouseenter', function(){
            $(this).addClass('focused')
        })
        .bind('mouseleave', function(){
            $(this).removeClass('focused')
        })

})