<!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. thinkphp mysql 坐标按距离排序

    $cha1 = new Model(); $shops = $cha1->query("select *,(2 * 6378.137* ASIN(SQRT(POW(SIN(3.1415 ...

  2. Zookeeper实战之嵌入式执行Zookeeper集群模式

    非常多使用Zookeeper的情景是须要我们嵌入Zookeeper作为自己的分布式应用系统的一部分来提供分布式服务.此时我们须要通过程序的方式来启动Zookeeper.此时能够通过Zookeeper ...

  3. 【b803】传纸条

    Time Limit: 1 second Memory Limit: 50 MB [问题描述] 小渊和小轩是好朋友也是同班同学,他们在一起总有谈不完的话题.一次素质拓展活动中,班上同学安排做成一个m行 ...

  4. JFinal redis cluster集群插件

    JFinal redis cluster集群插件 JFinal 框架到了2.1版本号,可是依旧仅仅支持redis的主从集群,没有看到Cluster集群的插件.笔者照着主从的插件方式,改了改,实现了个简 ...

  5. 三星语音AI助理背后的华人身影—73岁科技人三度创业成功（孙子兵法：道、天、地、将、法）

    我绝对不当老二,也不当老大,我要当霸主!”说这句话的是富迪科技董事长黄炎松.他还把“独霸”当作公司愿景宣言,大剌剌的放在美国总公司进门最显眼的墙上.   集微网消息,据台湾商业周刊报道,黄炎松,是台湾 ...

  6. scala 加载与保存xml文档

    package scala_enhance.xml import scala.xml.XML import scala.io.Source import jdk.internal.org.xml.sa ...

  7. 【BZOJ 1021】[SHOI2008]Debt 循环的债务

    [题目链接]:http://www.lydsy.com/JudgeOnline/problem.php?id=1021 [题意] [题解] 设f[i][j][k]表示前i种面值的钱币; 第一个人当前的 ...

  8. xaml 添加 region

    原文:xaml 添加 region 本文告诉大家如何在 xaml 添加 region 在 VisualStudio 2015 和 VisualStudio 2017 微软支持在 xmal 使用 reg ...

  9. Java native代码编译步骤简书

    Java native代码编译步骤简书 目的:防止java代码反编译获取密码算法 (1)编写实现类com.godlet.PasswordAuth.java (2)编译java代码javac Passw ...

  10. POJ - 1466 Girls and Boys 二分图＋最大独立集

    标题效果:有着n学生,有一些同学之间的特殊关系.. .为了一探究竟m学生.要求m免两者之间的学生有没有这样的特殊关系 解决问题的思路:二分图的问题,殊关系是对称的.所以能够将两个点集都设置为n个点.求 ...