JavaScript div 随着鼠标移动而移动

<style>#box1 {width: 100px;height: 100px;background-color: red;/* 开启绝对定位 */position: absolute;}</style><script>window.onload=function(){var box1=document.getElementById("box1");document.onmousemove=function(event){//兼容event = event || widow.event;// 获取滚动条滚动距离，chrome认为浏览器滚动条是body的通过//body.scrollTop来获取；火狐等则认为浏览器滚动条是html的var st=document.body.scrollTop||document.documentElement.scrollTop;var sl=document.body.scrollLeft||document.documentElement.scrollLeft;//获取鼠标坐标//clientX或Y用于可见窗口，div偏移量是相对整个页面的坐标使用pageX但IE8不支持var left=event.pageX;var top=event.pageY;//box1距离修改box1.style.left = left + "px";box1.style.top = top + "px";}}</script>
</head>
<body style="height: 1000px;width: 2000px;"><div id="box1"></div>
</body>

JavaScript div 随着鼠标移动而移动相关推荐

JavaScript div跟随鼠标移动
<!DOCTYPE html> <html> <head><meta charset="utf-8"><title>di ...
javascript+div实现鼠标划过,切换层效果
IE6.IE7.FireFox下测试通过, JS文件: <SCRIPT language=Javascript> function changea(srcObj,tid) { va ...
html鼠标可拖动窗体,javascript div 弹出可拖动窗口
javascript div 弹出可拖动窗口更新时间:2009年02月26日 21:50:37 作者: 创建弹出div窗口. /* * 创建弹出div窗口. 1.接口说明:DivWindow(i ...
JavaScript实现一串div跟随鼠标移动效果（幻影效果）
JavaScript实现一串div跟随鼠标移动效果上一篇博文我们说到了利用JavaScript实现div块跟随鼠标移动的效果.现在来讲一个进阶版,实现一串div跟随鼠标移动效果,鼠标幻影效果.如图: ...
html的盒子随页面动,JavaScript实现跟随鼠标移动的盒子
这篇文章主要为大家详细介绍了JavaScript实现跟随鼠标移动的盒子,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下本文实例为大家分享了JavaScript实现跟随鼠 ...
如何让一个div跟随鼠标移动
鼠标移动上去,弹出一个div,并且div跟随鼠标移动. 代码如下: <!DOCTYPE html> <html lang="zh-cn"> <head ...
js基础4 使用dom操作/getStyle/scrollHeight/协议滚动禁用例子/div随鼠标移动/冒泡/事件的委派/事件的绑定
使用dom操作 <!DOCTYPE html> <html lang="en"> <head><meta charset="UT ...
jquery实现div随着鼠标移动
jquery实现div随着鼠标移动 <!DOCTYPE html> <html lang="zh-CN"><head><meta char ...
如何使用CSS和JavaScript制作自定义鼠标光标
新钛云服已累计为您分享707篇技术干货您是否曾经访问过一个网站并被其惊人的功能所震撼?其中之一可能是一个很酷的鼠标光标,它不同于您习惯的常规箭头或指针光标. 这确实可以改善用户体验,最近我一直想知道 ...

JavaScript div 随着鼠标移动而移动

JavaScript div 随着鼠标移动而移动相关推荐

最新文章

热门文章