javascript - 如何使用 jquery 更改鼠标移动时 div 中的图像源?

标签 javascript jquery image swap mousemove

我正在尝试自学如何编码(尤其是网站)。我对 html 和 css 有很好的了解,目前正在学习 js。但要知道我需要社区的帮助才能取得进步!

我想知道如何实现在每次鼠标移动时多次(按顺序)更改图像源的效果? 示例:http://next2nothi.ng/

经过几次搜索,我无法找到实现这一目标的良好解决方案......

预先感谢您的帮助!

最佳答案

尝试

let list=[...Array(20)].map((x,i)=>`https://picsum.photos/150/150?image=${i}`);
let index=0;

document.addEventListener("mousemove", function(){
  document.getElementById("myImg").src = list[ ++index % list.length];  
});
<img id="myImg" width="150px" heigh="150px" >

关于javascript - 如何使用 jquery 更改鼠标移动时 div 中的图像源?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54767001/

相关文章:

javascript - Console.log() 和 settimeout(fn, 0)

javascript - 使用 GWT 在浏览器中进行图像处理

Javascript:getHtmlNavThumbTogglePanel 不是函数

javascript - 来自 Base64 图像的 AngularJS Bootstrap 轮播幻灯片数据

javascript - 使用事件监听器时保持 'this' 的值

jQuery 多个上下滑动div

javascript - 制作一个像 window.confirm 这样的函数,根据按钮单击返回 true 或 false

javascript - 通过 http 从 mjpeg 流中提取其他数据

image - 如何在NancyFx中制作图像处理程序

c++ - 使用at获取opencv中的像素值