<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <script type="text/javascript">

        window.onload = function () {

            var div1 = document.getElementById('div1');

            document.onmousemove = function (ev) {

                //IE支持event，firefox不支持

                var oEvent = ev || event;

                //

                var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;

                var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

                div1.style.top = oEvent.clientY + scrollTop + 'px'; //Y

                div1.style.left = oEvent.clientX + scrollLeft + 'px';//X

            };

        };

    </script>

</head>

<body>

    <div id="div1" style="width: 10px; height: 10px; background-color: blue; position: absolute;"></div>

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

    <br />

</body>

</html>

javascript div跟随鼠标移动的更多相关文章

  1. div跟随鼠标移动

    1.目标是实现div跟随鼠标而移动,分三种情况进行实现 a)首先获取div,进行绑定鼠标移动事件,给div开启定位功能 第一种实现方式,假如body的大小跟页面大小一样,则可以用这个方法. 1)获取鼠 ...

  2. javascript元素跟随鼠标在指定区域运动

    元素跟随鼠标在指定区域运动通常是用在商城图片的放大镜中,下面是完整的Demo: <!DOCTYPE html> <html lang="en"> <h ...

  3. 一组div跟随鼠标移动，反应鼠标轨迹

    <!DOCTYPE html> <html> <head> <title>div随鼠标移动</title> <style type=& ...

  4. javascript 一串DIV跟随鼠标移动

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  5. 完整的html+css+javascript实现跟随鼠标移动显示选中效果

    1,显示效果: 2,html结构 <div class="process_list-lpu"> <div class="process_line&quo ...

  6. javascript创建跟随鼠标好玩的东西

    不说话,直接上代码. css: #createGoDivBox{ display: none; } #createGoDivBox div{ background-color: #00A6C2; po ...

  7. 鼠标拖动div，div跟随鼠标移动效果

    <div id="boxDiv" style='width:20px;height:20px;position:absolute;background:red;'>   ...

  8. js 实现div跟随鼠标移动

    今天看到了一个自己可以随心所欲的拖到div到页面的任意位置.感觉挺好的,就心血来潮的查询了一下,看看网友做的 代码如下: <script>function doit(){ var obj ...

  9. jquery对div元素进行鼠标移动（稍稍修改下可以实现div跟随鼠标）

    /* 网上找了资料都是对于event.clientX和offset().left进行了计算,但是去掉了这个计算方式,直接使用当前坐标也一样,效果都一样不太好 strHeader:标题 jquery定位 ...

随机推荐

  1. UIButton set touch handler in code

    One option is to set the button up using [myButton addTarget:yourOtherClass action:@selector(mySelec ...

  2. cpp

  3. POJ 3125 Printer Queue

    题目: Description The only printer in the computer science students' union is experiencing an extremel ...

  4. iOS 视频播放的简单使用

    最近工作中有用到视频播放的内容,分享一些简单的用法给大家(由于网速问题,本例中使用的是本地的资源进行播放,要播放网络上的修改一些URL即可) 1.iOS9之前的视频播放 首先需要导入MediaPlay ...

  5. im消息丢失插件

    https://github.com/laughin/mocamsg mocamsg Moca message interceptor Openfire网络不好的情况下经常丢消息,一般情况都是服务器端 ...

  6. Android开发_SharedPreferences

    SharedPreferences是Android平台上一个轻量级的存储类,主要是保存一些常用的配置比如窗口状态,一般在Activity中 重载窗口状态onSaveInstanceState保存一般使 ...

  7. MySQLdb安装和使用2

    http://blog.chinaunix.net/uid-8487640-id-3183185.html MySQLdb是Python连接MySQL的模块,下面介绍一下源码方式安装MySQLdb: ...

  8. TCP 连接的建立和终止

    三路握手 建立一个TCP连接时会发生下述情形. (1)服务器必须准备好接受外来的连接.这通常通过调用socket.bind和listen这3个函数来完成的,我们称之为被动打开. (2)客户通过调用co ...

  9. 装有Win7系统的电脑在局域网不能共享的解决方案

    Win7系统的网络功能比XP有了进一步的增强,使用起来也相对清晰.但是由于做了很多表面优化的工作,使得底层的网络设置对于习惯了XP系统的人来说变得很不适应,其中局域网组建就是一个很大的问题.默认安装系 ...

  10. promise和Angular中的 $q, defer

    在ES6语法中,新出了promise构造函数, 可用来生成promise实例. Promise对象: 代表了未来某个将要发生的事件(通常是一个异步操作).有了promise对象, 可以将异步操作以同步 ...