如何解决图片在<div>中跟随鼠标
| 如何在特定的“ 0”位置跟随鼠标移动图片? 我知道我可以从e.pageX & e.pageY
和代码document.onmousemove = followmouse;
获得鼠标位置。每当鼠标在页面中移动时,都运行followmouse
功能,并在followmouse
功能中将图片位置设置为鼠标位置。对于我在这里问的确切问题(如何在特定的“ 0”位置跟随鼠标移动图片),我有以下想法:
获取我的div的顶部,左侧,宽度和高度,并做一些数学运算,如果鼠标移出div
,则为图片设置visibility:hidden
。
但是,没有任何简单的方法可以做到这一点吗?
解决方法
假设您有一些这样的HTML,
<div id=\"mydiv\" style=\"width: 300px; height: 300px;\"></div>
<img id=\"myimg\" style=\"position: absolute;\" alt=\"\" />
然后
document.getElementById(\"mydiv\").onmousemove = function(e) {
document.getElementById(\"myimg\").style.top = e.pageY*1 + 5 + \"px\";
document.getElementById(\"myimg\").style.left = e.pageX*1 + 5 + \"px\";
}
仅当鼠标位于div
上时,才会将图片移动到鼠标上。
, 只要图片实际上包含在ѭ6中,并且将其相对于其正常位置移动,那么我认为将ѭ12设置在包含的ѭ6中就应该起作用。当我说“设置”时,并不是说鼠标每次移到外面,而是在主CSS中移一次。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。