<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试</title>
    <style>
      div{
          width: 10px;
          height: 10px;
          background-color: red;
          position: absolute;
      }
    </style>
</head>
<body >
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>

<script>
    window.onload=function(){
        var oDiv=document.getElementsByTagName('div');
        document.onmousemove=function(ev){
            oEvent=ev||event;
            for(var i=oDiv.length-1;i>0;i--){    //倒序的好处。。
                oDiv[i].style.top=oDiv[i-1].style.top;
                oDiv[i].style.left=oDiv[i-1].style.left;
            }
            oDiv[0].style.top=oEvent.clientX+'px';
            oDiv[0].style.left=oEvent.clientY+'px';
        }
    }
</script>

</body>
</html>

javascript 的 梯子的更多相关文章

  1. JavaScript的妙与乐(一)之 函数优化

    JavaScript的妙与乐系列文章主要是展示一些JavaScript上面比较好玩一点的特性和一些有用的技巧,里面很多内容都是我曾经在项目中使用过的一些内容(当然,未必所有技巧的使用频率都很高^_^) ...

  2. javascript中的闭包解析

    学习javaScript已经有一段时间了,在这段时间里,已经感受到了JavaScript的种种魅力,这是一门神奇的语言,同时也是一门正在逐步完善的语言,相信在大家的逐步修改中,这门语言会逐步的完善下去 ...

  3. thinkphp,javascript跨域请求解决方案

    javascript跨域请求解决方案 前言 对于很多前端或者做混合开发的同学,我们难免会遇到跨域发起请求业务,比如A站点向B站点请求数据等等.由于最近要做一个站点集群的项目,所以具体业务要求很多个站点 ...

  4. "大哥,割草机借我用一下,我修整一下草坪。" ---- 谈谈this与JavaScript函数调用的不解之缘

    在写上一篇有关apply和call的博文时(闲聊JS中的apply和call),起初我还是担心大家理解起来比较困难,因为要理解apply调用方式的前提是,至少先理解在JavaScript中函数调用是什 ...

  5. 正则表达式 - JavaScript描述

    正则表达式 - JavaScript描述 概述 正则表达式是被用来匹配字符串中的字符组合的模式.在JavaScript中,正则表达式也是对象. 创建正则表达式 var re = /abc/; // 使 ...

  6. JavaScript之父Brendan Eich,Clojure 创建者Rich Hickey,Python创建者Van Rossum等编程大牛对程序员的职业建议

    软件开发是现时很火的职业.据美国劳动局发布的一项统计数据显示,从2014年至2024年,美国就业市场对开发人员的需求量将增长17%,而这个增长率比起所有职业的平均需求量高出了7%.很多人年轻人会选择编 ...

  7. javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈

    Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...

  8. Javascript 的执行环境(execution context)和作用域(scope)及垃圾回收

    执行环境有全局执行环境和函数执行环境之分,每次进入一个新执行环境,都会创建一个搜索变量和函数的作用域链.函数的局部环境不仅有权访问函数作用于中的变量,而且可以访问其外部环境,直到全局环境.全局执行环境 ...

  9. 探究javascript对象和数组的异同,及函数变量缓存技巧

    javascript中最经典也最受非议的一句话就是:javascript中一切皆是对象.这篇重点要提到的,就是任何jser都不陌生的Object和Array. 有段时间曾经很诧异,到底两种数据类型用来 ...

随机推荐

  1. 安全快速修改Mysql数据库名的5种方法

    1. RENAME DATABASE db_name TO new_db_name这个..这个语法在mysql 5.1.7中被添加进来,到了5.1.23又去掉了.据说有可能丢失数据.还是不要用的好.详 ...

  2. 【python】类中__slots__使用

    __slots__作用:限制类的属性,只给实例绑定任何属性和方法 如果我们想要限制class的属性怎么办?比如,只允许对Student实例添加name和age属性. 为了达到限制的目的,Python允 ...

  3. Android学习笔记(三)

    在手机应用中菜单是很重要的一部分,它能够以直观的界面让用户去选择,现在我们学习如何去新建一个菜单. 首先在res目录下新建一个menu文件夹,然后在menu文件夹下新建一个Android XML Fi ...

  4. Visual Studio 2015里面汇编工具Asm Dude的配置!

    最近开始学习汇编,也开始使用Visual Studio 2015写汇编程序,比较了半天,最后觉得Asm Dude应该是目前Visual Studio 2015非常好的汇编开发插件了,但是如果默认安装上 ...

  5. ubuntu下安装php memcache扩展

    memcached 安装sudo apt-get install memcached memcached 参数说明memcached -d -m 50 -p 11211 -u root-m 指定使用多 ...

  6. Java中的代理模式

    代理模式在Java Web的框架中经常使用到.比如说在对数据库的访问中,核心功能是对数据库的增删改查,而连接数据库.处理事务等功能我们在开发中也要考虑到.所以我们将数据库的CRUD抽象到接口中,然后实 ...

  7. MATLAB那些常见的命令

    1.clear :清除内存变量和函数,也就是把WorkSpace的变量给清空: 2.clc :清楚当前Matlab命令窗口的内容:相当于清楚屏幕吧,重新开始,简洁一点,注意clc是不清 楚变量的.一般 ...

  8. python 向上取整ceil 向下取整floor 四舍五入round

    #encoding:utf-8 import math #向上取整 http://www.manongjc.com/article/1335.html print "math.ceil--- ...

  9. 创建线程方式-NSThread

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  10. Android Studio JNI/NDK 编程(二) Windows 下环境搭建 demo 开发

    环境 windows 8  (注:其实 Linux 开发可能更方便) Android Studio 2.1; 一 . 下载 安装android-ndk开发包 地址:链接:http://pan.baid ...