事件处理程序：鼠标离开延迟反应

Question

我一直试图让鼠标进入扩展框并在鼠标离开时展开。我已经能够达到这一点;但是，当我将鼠标悬停在某个项目上时，然后收缩浏览，再次将鼠标悬停在该项目上，该对象不会移回到它正确的位置。它需要大约十秒钟......任何人都有解决方案吗？下面是网站：http://www.snowtailcreative.com/rene_milbery/index.html

这是我的HTML代码：

<div class="spotlight-item">
<h2>Lorum Ipsum</h2>
<p>Mauris venenatis a justo lobortis elementum. Suspendisse varius urna tristique justo sodales condimentum. Quisque et euismod massa.</p>
<p class="more-details">Quisque imperdiet nibh sed sagittis dignissim. Nullam vel massa nisi. Integer cursus libero eu semper congue. Sed pulvinar vehicula leo, quis vulputate orci. Vestibulum quis diam ipsum. Mauris venenatis a justo lobortis elementum. Suspendisse varius urna tristique justo sodales condimentum. Quisque et euismod massa.</p>
</div>

这是我的适用CSS：

.more-details {
    display: none;
}

这是我的JavaScript

$(document).ready(function(){

    // Set Default Viewport Size
    var viewport = $(window).width();

    // Call Functions
    boundingBoxes ();

    // Actions On Window Resize
    $(window).resize(function() {
        viewport = $(window).width();
        for (var i = 0; i < 1; i++) {boundingBoxes ();}

    });

    // Bounding Boxes
    function boundingBoxes () {
        if (viewport >= 760) {
            $(".spotlight-item").on({
                mouseenter: function() {
                    $(this).children().show(600);   
                    $(this).animate({marginTop: "-190px"}, 600);
                },
                mouseleave: function () {
                    $(this).children(".more-details").hide(600);
                    $(this).animate({marginTop: "0px"}, 600);   
                }
            });
        }
        else if (viewport < 760) {
            $(".spotlight-item").off();
        }
    }

});