Я выполняю на mouseenter / mouseleave с jQuery, и он, кажется, работает, но не при выходе из div. Это работает только когда я выхожу из окна.

Это мой jQuery

$(document).ready(function() {
  $(".pods .col").on("mouseenter", function() {
    $(this).find(".pod-overlay").addClass("show")
  });
  $(".pods .col").on("mouseleave", function() {
    $(this).find(".pod-overlay").removeClass("show")
  });
});

Это мой HTML

<div id="splash" class="section section-splash bg">
  <div class="pods">
    <div class="col col-4">
      <div id="pod-splash-food" class="pod pod-food">
        <div class="pod-overlay"></div>
      </div>
    </div>
  </div>
</div>

Я сделал скрипку JS здесь. Я учусь jquery, поэтому совет ценится.

http://jsfiddle.net/34h48148/