<!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. Call to a member function assign() on a non-object;thinkphp中报错

    这个在自己写的类中 需要function __construct(){parent::__construct();}继承父类构造函数 当发生这个错误的时候,需要在构造函数中集成父类构造

  2. Mac下Android studio 之NDK配置教程(一)

    Mac下Android studio 之NDK配置教程(一) 1.概述 近期项目全线转移到Mac下使用使用Android studio开发. 遇到关键代码封装到 ***native***层,此时在wi ...

  3. html5-7 html5语义标签和视频

    html5-7  html5语义标签和视频 一.总结 一句话总结:设计网站的时候要兼顾早期浏览器的话,最新技术要缓着用,自己可以先尝试. 1.html5所有标签共有属性有哪四种? 1.id2.clas ...

  4. [Grid Layout] Describe a grid layout using named grid lines

    We can use named grid lines to describe our grid layout. Let’s see how to apply this to our grid-tem ...

  5. [React] Render Basic SVG Components in React

    React loves svg just as much as it loves html. In this lesson we cover how simple it is to make SVG ...

  6. UItableview正在滚动的时候进行操作容易出问题

    tableview正在滚动的时候进行其它点击事件操作容易出问题,有时候会出现莫名其妙的数组越界的bug, 解决方法:1.对objectatindex方法进行异常判断 2. [_tableview se ...

  7. sparksql load/save

    java public class LoadAndSaveDemo { private static SparkConf conf = new SparkConf().setAppName(" ...

  8. Quartz 在线Cron表达式

    Quartz自己配置Cron好麻烦,下面是一个在线Cron表达式生成器的网站,非常方便,现在使用Cron时基本上就直接用这个了. http://cron.qqe2.com/ Cron表达式 cronE ...

  9. iOS开发 － Swift － 自己写的一个九宫格解锁的Demo

    前段时间做项目,公司要用到一个九宫格的手势解锁的需求. 虽然在很多地方都可以找到写好的第三方源码, 但是我的性格是不喜欢Ctrl+V的,于是自己凭着理解敲了一个出来,功能很简单,只是单纯的返回结果.附 ...

  10. matlab 求解线性规划问题

    线性规划 LP(Linear programming,线性规划)是一种优化方法,在优化问题中目标函数和约束函数均为向量变量的线性函数,LP问题可描述为: minf(x):待最小化的目标函数(如果问题本 ...