使动态图像跟随鼠标

Make a dynamic image follow mouse

本文关键字：鼠标 跟随 图像 动态      更新时间：2023-09-26

有这个版本的图像跟随鼠标:

http://jsfiddle.net/BfLAh/1/

我试着让它工作与一个动态加载的图像，像这样:

var a = new Image();
a.src = 'https://upload.wikimedia.org/wikipedia/commons/6/6a/This_is_a_demo_blue_dot.png';
a.onload = g;
function g(){
    $(document).mousemove(function(e){
        $(a).css({left:e.pageX, top:e.pageY});
    });
}

但是它不起作用。我需要它以这种方式工作，因为我以后也要在画布上画它。

我想问题是，jQuery不能找到图像的方式，所以我如何使它的工作?

设置id为元素，并将其附加到DOM

由于position : absolute;是通过css应用的，因此必须在图像元素上应用id。

var a = new Image();
a.id = 'image';
a.src = 'https://upload.wikimedia.org/wikipedia/commons/6/6a/This_is_a_demo_blue_dot.png';
$('body').append(a);
a.onload = g;
function g() {
  $(document).mousemove(function(e) {
    $(a).css({
      left: e.pageX,
      top: e.pageY
    });
  });
}
#image {
  position: absolute;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

相关文章：