Javascript jQuery鼠标悬停，在为true时设置左或右动画

我想将溢出的div（根据窗口加载计算）向右或向左移动，这取决于用户的鼠标位置。（鼠标仍在那里时连续动画）。我有一些错误/问题

当鼠标仍在上方时，移动到该方向而不停止

如果我使用动画功能，这将工作与开始和停止一次又一次地导致不良动画

有什么想法吗

注意：除了jquery，我不想使用任何额外的库

$(window).load(function() {
    var buildingsWrapper = $('#buildings'),
        lastBuilding = $('.building:last');

    buildingsWrapper.width(parseInt(lastBuilding.css('left')) + lastBuilding.width());

    var followMouseMove = function() {
        var animStarted = false;

        // ok now, mouse over but this will work for just one time.
        buildingsWrapper.on('mouseover', function(e) {
            if(e.clientX >= $(window).width() - 100) {
                var left = buildingsWrapper.css('left');

                if(!animStarted) {
                    animStarted = true;

                    // will work but will stop and start again after animStarted set to false. that start / stop is not what i want.
                    buildingsWrapper.animate({
                        left: parseInt(left) - 50
                    }, 300, function() {
                        animStarted = false;
                    });
                }
            }
        });
    };

    followMouseMove();
});

尝试鼠标移动：

buildingsWrapper.on('mouseover', function(){
     $(document).mousemove( function(e) {
            var mouseX = e.pageX;
            var slideT = (mouseX*(-1))+"px";



        buildingsWrapper.css({'left': slideT});
});     
        });

尝试修改幻灯片以获得所需动画

尝试mousemove:

buildingsWrapper.on('mouseover', function(){
     $(document).mousemove( function(e) {
            var mouseX = e.pageX;
            var slideT = (mouseX*(-1))+"px";



        buildingsWrapper.css({'left': slideT});
});     
        });

---

尝试修改slideT以获得您想要的动画

不起作用，因为用户必须移动鼠标来设置动画（向右或向左）。不起作用，因为用户必须移动鼠标来设置动画（向右或向左）。