Javascript I'；m在mousemove上将图像附加到光标上。它一直工作到我滚动，这会分离图像，在页面上向上移动它

解决方案：

$(document).mousemove(function (e) {
    var img = $(singleCardSearchElementIds.HoverImageClassName);
    var windowScrollY = window.scrollY;
    img.css({ 'top': windowScrollY + e.clientY, 'left': e.clientX + 20 });
});

---

这就是我的主要内容：

<main class="w-100 main-container">
    <div id="contentContainer" class="mw8 center content-container">
        <div id="cardContainer" class="flex flex-wrap">

        </div>
        <div id="tableContainer" class="mv2 dn">
            <img class="hover-card hover-card-loading dn" alt="" src="" />

            <table id="cardTable">
                <thead>
                    <tr>
                        <th>CardId</th>
                        <th>Set</th>
                        <th>No.</th>
                        <th>Name</th>
                        <th>Cost</th>
                        <th>Type</th>
                        <th>Rarity</th>
                        <th>Artist</th>
                        <th>ImageUrl</th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
</main>

当只有几行时，它可以正常工作：

但是，如果有一堆行，我需要滚动，则图像会随着我向下移动光标而向上移动：

---

知道这里发生了什么吗？

在“注释”的继续部分中，如果将视口的滚动Y添加到图像的顶部css属性的顶部，会发生什么情况。因为滚动Y开始时为0，所以您可以获得所需的行为，但一旦该行为增加，您就不会得到

$（文档）.mousemove（函数（e）{
var img=$（SingleCardSearchElementId.HoverImageClassName）；
var topY=$（window.scrollTop（）；
css（{'top'：topY+（e.clientY-110），'left'：e.clientX+20}）；
});如果将视口的滚动Y添加到图像的top css属性的顶部，会发生什么情况。因为滚动Y开始时为0，所以您得到了所需的行为，但一旦该行为增加，您就没有了。@GetSet您是个天才。我卷动窗口，将其添加到光标clientY，并将其设置为imagestop属性，它工作得非常好。请提交答案，以便我可以接受。谢谢嘿，很高兴它成功了。我现在要补充一个答案。希望它足够了
$(document).mousemove(function (e) {
    var img = $(singleCardSearchElementIds.HoverImageClassName);
    img.css({ 'top': e.clientY - 110, 'left': e.clientX + 20 });
});