当元素在其下动态移动时,光标样式不会更新

时间:2014-08-08 18:04:06

标签: javascript css dom cursor dhtml

当元素在光标位置下动态移动时,光标样式不会更新,直到用户将光标移动至少1px 。例如,假设我有一些Javascript在鼠标单击时直接在光标下移动div

<div style="cursor:move">hover me!</div>

如果将鼠标悬停在div上,光标将变为move。但是,如果单击并在光标下移动div,光标将保持默认箭头,直到您将光标移动至少1px。

Here's a JSFiddle demo.

有没有办法通过Javascript直接更改光标或强制光标正确更新?

1 个答案:

答案 0 :(得分:2)

暂时手动设置光标移动似乎有效。 只要再次移动鼠标,就会清除JS应用的CSS +正常行为接管。

http://jsfiddle.net/x0nbvt25/2/

$(document).ready(function(){
    $("body").on("click", function(c){
        $(".drag").offset({
            top: c.pageY-8,
            left: c.pageX-25
        });
        $("body").css("cursor", "move");
        $("body").mousemove(function(){
            $("body").css("cursor", '');
        });
    });
});