イメージをスクロールバーに影響を与えないようにするにはどうすればよいですか？

Question

私は、以下のものを使用して私のマウスを、以下のイメージを持っている：

$(document).mousemove(function(e) { 
 
    $(".image").css({ 
 
    left: e.pageX + 50, 
 
    top: e.pageY + 50 
 
    }); 
 
});

.image { 
 
    position: absolute; 
 
    width: 5%; 
 
    height: 10%; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<img class="image" src="Media/example.png" />

私のマウスは私の次の画像のように、ウェブサイトの底部または右側にあるときに問題が発生マウスが画面外に出て（意図しない）、このため、スクロールバーがWebサイトに表示されます。

マウスをたどる画像がどれだけスクロールできるかには影響しません。これをどうやって解決するのですか？あなたは、画像をあなたが探しているものウィンドウを拡大するのではなく、画面をオフに消えたい場合

Answer 1

はbodyにoverflow: hiddenを適用することです。 hiddenのoverflow両方のクリップコンテンツとスクロールバーを非表示にします。

$(document).mousemove(function(e) { 
 
    $(".image").css({ 
 
    left: e.pageX + 50, 
 
    top: e.pageY + 50 
 
    }); 
 
});

.image { 
 
    position: absolute; 
 
    width: 5%; 
 
    height: 10%; 
 
} 
 

 
body { 
 
    overflow: hidden; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<img class="image" src="http://placehold.it/100" />

は、この情報がお役に立てば幸い！ :)