<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        onload = function () {
            onmousemove = function (e) {
                var img = document.getElementById('img');
                img.style.position = 'absolute';
                img.style.left = e.clientX + 'px';//记得加px
                img.style.top = e.clientY + 'px';
            }
        }
    </script>
</head>
<body>
    <img src="idle.png" id="img"/>
</body>
</html>

js 小野人跟着鼠标移动的更多相关文章

  1. JS-鼠标跟随块（一个小圆点跟着鼠标跑）

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. Javascript实现让小图片一直跟着鼠标移动

    Javascript实现让小图片一直跟着鼠标移动实例 注意:图片可能加载不出来,注意更换 <!doctype html> <html> <head> <met ...

  3. [读码][js,css3]能感知鼠标方向的图片遮罩效果

    效果图: 无意间看到过去流行的一个效果:[能感知鼠标方向的图片遮罩效果]近来不忙,就仔细的看了一看看到后来发现,网上有好多版本,谁是原著者似乎已经无法考证.读码就要读比较全面的,读像是原著的代码.代码 ...

  4. 一些js小题（一）

    一些js小题,掌握这些对于一些常见的面试.笔试题应该很有帮助: var a=10; function aa(){ alert(a); } function bb(){ aa(); } bb();//1 ...

  5. JS仿QQ空间鼠标停在长图片时候图片自动上下滚动效果

    JS仿QQ空间鼠标停在长图片时候图片自动上下滚动效果 今天是2014年第一篇博客是关于类似于我们的qq空间长图片展示效果,因为一张很长的图片不可能全部把他展示出来,所以外层用了一个容器给他一个高度,超 ...

  6. JS---案例：图标跟着鼠标飞(有bug)

    案例:图标跟着鼠标飞(有bug) <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  7. 用chrome的snippets片段功能创建页面js外挂程序，从控制台创建js小脚本

    用chrome的snippets片段功能创建页面js外挂程序,从控制台创建js小脚本 Chrome的snippets是小脚本,还可以创作并在Chrome DevTools的来源面板中执行.可以访问和从 ...

  8. JS---案例：图片跟着鼠标飞的最终版本

    案例:图片跟着鼠标飞的最终版本 换了个好看的糖果照片,想给博客首页加上,但是加上后,应该是overwrite原来的html,所以光有鼠标跟着飞的效果,原来的功能都不能用了 放入common.js &l ...

  9. js小功能整理

    /** * 判断是否包含字符串某字符串 * @param {[type]} str [被检测的字符串] * @param {[type]} substr [检测是否含有的字符串] * @return ...

随机推荐

  1. 监听text等的改变事件

    oninput事件是html5的标准事件,支持ie9和以上以及其他的火狐啊谷歌啊等浏览器 ie9以下的可以用onpropertychange <head>     <script t ...

  2. AOP概述：

    AOP可以在不修改源代码的情况下,对程序进行增强. AOP面向切面进行编程,Spring将AOP引入到框架中,但是也需要遵守AOP联盟的规范. 通过预编译的方式和运行期动态代理实现程序功能的同意维护的 ...

  3. [JS Compose] 5. Create types with Semigroups

    An introduction to concatting items via the formal Semi-group interface. Semi-groups are simply a ty ...

  4. 逐步把Nginx及Redis引入项目组之负载均衡技术调研初版总结

    本篇以一个Nginx服务.两个Tomcat服务.一个Redis搭建一个负载均衡环境,由于就一台电脑暂以随机分配client请求策略开展,详细工作中推荐以IP地址来实现client请求的动态负载策略.省 ...

  5. Windows 程序启动性能优化（先载入EXE，后载入DLL，只取有限的代码载入内存，将CPU的IP指向程序的入口点）

    一.重定位链接时重定位:目标文件一般由多个节组成,编译器在编译每个目标文件时一般都是从0地址开始生成代码.当多个代码节合成一个代码段时,需要根据其在最终代码段中的位置做出调整.同时,链接器需要对已经解 ...

  6. new File(String Path)加载资源问题

    2017-12-17   15:07:38  [原创-wx] 一.我们在用IO流加载资源的时候,创建文件资源 1 File file = New File("String Path" ...

  7. CSS学习小结

    接触了B/S的东西之后才发现自己须要学习的东西太多了.html.xml.JavaScript.jquery.HTMLdom.VBScript.ajax.jquery.json等等技术都是须要我们一一研 ...

  8. Erlang中频繁发送远程消息要注意的问题

    http://avindev.iteye.com/blog/76373 注:这篇文章可能会有争议,欢迎提出意见 在Erlang中,如果要实现两个远程节点之间的通信,就需要通过网络来实现,对于消息发送, ...

  9. 【a901】滑雪

    Time Limit: 10 second Memory Limit: 2 MB 问题描述 滑雪是一项非常刺激的运动,为了获得速度,滑雪的区域必须向下倾斜,而且当你滑到坡底,你不得不再次走上坡或者等待 ...

  10. erlang中如何调试程序

    学习一门语言,当学习那些基本语法的时候,我们常常会忽略它的程序调试,当程序稍微复杂一点的时候,我们不能保证程序的完全正确,我们会为其发愁,这时,程序的调试就变得相当重要了.    在erlang环境搭 ...