<!DOCTYPE html>

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

<head>

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

    <title></title>

    <style type="text/css">

        #div1

        {

            width: 100px;

            height: 100px;

            background-color: red;

        }

    </style>

    <script type="text/javascript">

        function StartMove() {

            //避免多定时器同时工作

            clearInterval(timer);

            var oDiv = document.getElementById("div1");

            timer = setInterval(function () {

                var speed = 10;

                if (oDiv.offsetLeft >= 300) {

                    clearInterval(timer);

                } else {

                    oDiv.style.left = oDiv.offsetLeft + speed + 'px';

                }

            }, 30);

        }

    </script>

</head>

<body>

    <input type="button" id="btn" value="运动" onclick="StartMove()" />

    <br />

    <br />

    <div id="div1"></div>

</body>

</html>

　　

Javascript的动态运动（1）的更多相关文章

  1. canvas ：原生javascript编写动态时钟

    canvas :原生javascript编写动态时钟     此时针是以画布的中心为圆心: g.translate(width/2,width/2); 此函数是将画布的原点移到(width/2,wid ...

  2. JavaScript DOM动态创建（声明）Object元素

    http://www.cnblogs.com/GuominQiu/archive/2011/04/01/2002783.html 一文提及“等整个页面加载完毕后,根据用户所选的阅读机类型,再用Java ...

  3. 每天一个JavaScript实例-动态省份选择城市

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  4. 理解Javascript的动态语言特性

    原文:理解Javascript的动态语言特性 理解Javascript的动态语言特性 Javascript是一种解释性语言,而并非编译性,它不能编译成二进制文件. 理解动态执行与闭包的概念 动态执行: ...

  5. 第一百一十八节，JavaScript，动态加载脚本和样式

    JavaScript,动态加载脚本和样式 一动态脚本 当网站需求变大,脚本的需求也逐步变大.我们就不得不引入太多的JS脚本而降低了整站的性能,所以就出现了动态脚本的概念,在适时的时候加载相应的脚本. ...

  6. JavaScript 拥有动态类型

    字符串.数字.布尔.数组.对象.Null.Undefined JavaScript 拥有动态类型 JavaScript 拥有动态类型.这意味着相同的变量可用作不同的类型: 实例 var x // x ...

  7. JavaScript 创建动态表格

    JavaScript 创建动态表格 版权声明:未经授权,严禁转载! 案例代码 <div id="data"></div> <script> va ...

  8. JavaScript的动态特性(通过eval,call,apply和bind来体现)

    JavaScript的动态特性(通过eval,call,apply和bind来体现) JavaScript是一种基于面向对象的.函数式的.动态的编程语言.现在发展到已经可以用在浏览器和服务器端了. 这 ...

  9. Arcgis javascript api 动态图层自图层可见性设置

    Arcgis javascript api 动态图层自图层可见性设置 子图层管理 rest服务 sublayers sublayer ArcGISDynamicMapServiceLayer 本文主要 ...

随机推荐

  1. linux下dup/dup2函数的用法

    系统调用dup和dup2能够复制文件描述符.dup返回新的文件文件描述符(没有用的文件描述符最小的编号).dup2可以让用户指定返回的文件描述符的值,如果需要,则首先接近newfd的值,他通常用来重新 ...

  2. DIV_ROUND_UP(x,y)实现x/y向上取整

    #define DIV_ROUND_UP(x,y) (((x) + ((y) - 1)) / (y)) 1.问题 x.y都是整数,且x > 1, y > 1,求 x / y的向上取整,即: ...

  3. Scrapy源码学习（一）

    用Scrapy已经有一段时间了,觉得该是看一下源码的时候了.最开始用的时候还是0.16的版本,现在稳定版已经到了0.18.结合使用Scrapy的过程,先从Scrapy的命令行看起. 一.准备 下载源代 ...

  4. php 获取链接参数

    private function getQuerystr($url,$key){        $res = '';        $a = strpos($url,'?');        if($ ...

  5. smarty框架块函数

    块函数的形式是这样的:{func} .. {/func}.换句话说,它们被封闭在一个模板区域内,然后对该区域的内容进行操作.默认地,你的函数实现会被Smarty调用两次:一次是在开始标签,另一次是在闭 ...

  6. python杂记-2(python之文件)

    文件打开函数:f = open 表1-1:open函数中模式参数常用值 打开模式 描述 'r' 读模式 'w' 写模式 'a' 追加模式 'b' 二进制模式 '+' 读/写模式 表1-2:文件对象方法 ...

  7. [转]Linux中find常见用法示例

    Linux中find常见用法示例[转]·find   path   -option   [   -print ]   [ -exec   -ok   command ]   {} \;find命令的参 ...

  8. hadoop集群默认配置和常用配置【转】

    转自http://www.cnblogs.com/ggjucheng/archive/2012/04/17/2454590.html 获取默认配置 配置hadoop,主要是配置core-site.xm ...

  9. MySQL主从同步报Client requested master to start replication from position

    数据库版本:5.6.16 测试环境MySQL 主从,数据库被人重启,忘记开启start slave,导致主从失效,停了一天的数据没有追上. 查看从库的数据库状态:show   slave   stat ...

  10. int main(int argc,char* argv[])参数详解

    argc是命令行总的参数个数 argv[]是argc个参数,其中第0个参数是程序的全名,以后的参数 命令行后面跟的用户输入的参数,比如: int main(int argc, char* argv[] ...