javascript - 通过指向 X、Y 坐标移动图像

Question

我有以下代码：

var currX = 0;
var currY = 0;
var player = $('#player');
//Checks to see which key is pressed down
        $(window).on('mousedown', function(e) { 
            currX = e.offsetX;
            currY = e.offsetY;
            console.log(e.offsetX + ', ' + e.offsetY);
        });


        player.css({
            left: function(index,value) { return (value + currX + 'px'); },
            top: function(index,value) { return  (value + currY + 'px'); }
        });

图像根本不动。我console.log输出了两个偏移量，它们被正确打印出来。

谢谢！

Answer 1

您正在将 和 的值设置为top函数left。执行该代码时，将对其进行一次评估。如果您想要player移动鼠标，您想在 mousedown 侦听器中执行该代码。

Answer 2

你应该在 mousedown 事件中应用这个 css ：

$(window).on('mousedown', function (e) {
    currX = e.offsetX;
    currY = e.offsetY;
    console.log(e.offsetX + ', ' + e.offsetY);
    player.css({
        left: currX + 'px',
        top: currY + 'px'
    });
});

小提琴