полоса прокрутки по оси x, препятствующая наведению курсора

У меня есть страница с элементами, у которых есть панель зависания, как внизу, так и над ними, в зависимости от того, подходит ли она под страницей. он отлично работает, если не отображается полоса прокрутки x, и в этом случае поле может оставаться под элементом, даже если полоса прокрутки препятствует коробке. чтобы продемонстрировать это. вы можете посетить этот jsFiddle и просто медленно нависнуть сверху донизу ввода, я думаю, вы поймете, что я имею в виду. Это всего лишь небольшая ошибка, но я бы хотел ее исправить, если кто-то знает, как это сделать. Спасибо. Здесь Javascript:

$(document).mousemove(function(e) {
 leftX=(e.pageX -($('#box').width()+20)) + "px";

if((e.pageY+($('#box').height() + 31)) < ($(window).scrollTop() + window.innerHeight)){
   topY = (e.pageY + 20) + "px";
}else{
   topY=e.pageY - $('#box').height() - 20 + "px";
}

  $('#box').css({'top':topY,'left':leftX});

});

$('input').mouseout(function(){
    $('#box').hide();
});

$('input').mouseover(function(){
    $('#box').show();
});