<style type="text/css">

*

{

    margin:0px auto;

    padding:0px;

    font-family:"微软雅黑";}

#tuijian

{

    width:760px;

    height:474px;

    background-repeat:no-repeat;}

.pages

{

    top:230px;

    background-color:#FFF;

    background-position:center;

    background-repeat:no-repeat;

    opacity:0.4;

    width:30px;

    height:60px

    }

#p1

{

    background-image:url(zuo.png);

    float:left;

    margin:150px 0px 0px 10px;}

#p2

{

    background-image:url(you.png);

    float:right;

    margin:150px 10px 0px 0px;}

</style>

</head>

<body>

<!--2.换图-->

<div id="tuijian" style="background-image:url(t1.jpg);">

<div class="pages" id="p1" onclick="dodo(-1)"></div>

<div class="pages" id="p2" onclick="dodo(1)"></div>

</div>

<!--1.10s后同意-->

<form>

<input id="wait" type="button" value="同意(10)" disabled="disabled" />

</form>

</body>

</html>

<script language="javascript">

var jpg = new Array();

jpg[0]="url(t1.jpg)";

jpg[1]="url(t2.jpg)";

jpg[2]="url(t3.jpg)";

var tjmg = document.getElementById("tuijian");

var xb=0;var n=0;

function huan()

{

    xb++;

    if(xb==jpg.length)

    {

        xb=0;

    }

    tjmg.style.backgroundImage=jpg[xb];

    if(n==0)

    {

        var id = window.setTimeout("huan()",3000);

    }

}

function dodo(m)

{

    n=1;

    xb=xb+m;

    if(xb<0)

    {

        xb=jpg.length-1;

    }

    else if(xb>=jpg.length)

    {

        xb=0;

    }

    tjmg.style.backgroundImage=jpg[xb];

}

window.setTimeout("huan()",3000);

var n=10;

var wait = document.getElementById("wait");

function bian()

{

    n--;

    if(n==0)

    {

        wait.removeAttribute("disabled");

        wait.value="同意";

        return;

    }

    else

    {

        wait.value="同意("+n+")";

        window.setTimeout("bian()",1000);

    }

}

window.setTimeout("bian()",1000);

</script>

JavaScript 例题延迟10s 自动手动换图的更多相关文章

  1. JavaScript 文件延迟和异步加载

    JavaScript 文件延迟和异步加载 -般情况下,在文档的 <head> 标签中包含 JavaScript 脚本,或者导入的 JavaScript 文件. 这意味着必须等到全部 Jav ...

  2. JavaScript值延迟脚本和异步脚本

    Html 4.0为<script>标签定义了defer属性,这个属性的用途是表名脚本在执行时,不会影响页面的构造.也就是说,脚本会延迟到整个页面解析完毕之后在运行,因此,在<scri ...

  3. [troubleshoot][archlinux][X] plasma(KDE) 窗口滚动刷新冻结（约延迟10s）（已解决，root cause不明，无法再次复现）

    现象: konsole,setting等plasma的系统应用反应缓慢,在滚动条滚动时,尤为明显. 触发条件: 并不是十分明确的系统滚动升级(Syu)后,产生. 现象收集: 可疑的dmesg [ :: ...

  4. JavaScript高级程序设计-(1)html中使用JavaScript

    html中使用JavaScript 1.延迟脚本 script标签定义了defer属性,脚本会被延迟到整个页面都解析完毕后运行 详细内容如下: 2.异步脚本 script标签定义了async属性,as ...

  5. JavaScript高级程序设计—阅读笔记（第一部分）

    第一章 JavaScript简介1.JavaScript组成(核心(ECMAScript),文档对象模型(DOM),浏览器对象模型(BOM))2.文档对象模型(DOM),提供访问和操作网页内容的方法和 ...

  6. 高性能JavaScript（快速响应的用户界面）

    浏览器UI线程 用于执行JavaScript代码和更新界面的进程被称为 “浏览器UI线程” . UI线程的工作基于一个简单的队列系统,任务会被保存到队列中直到线程空闲,一旦空闲队列就被重新提取出来运行 ...

  7. 从JavaScript的单线程执行说起

    先看一段代码: 1 2 3 4 5 setTimeout(function(){     alert("a"); }, 0); while(1); alert("b&qu ...

  8. Wireshark 分析Linux SSh 远程登录延迟问题

    1.PuTTy远程登录延迟的分析 现象问题描述:在使用kali linux 的时候喜欢在后台运行而在Windows主机系统上安装PuTTY来实现远程登录 发现每次输入密码的时候会存在延迟10s的情况, ...

  9. 《高性能javascript》阅读摘要

    最近在阅读这本Nicholas C.Zakas(javascript高级程序设计作者)写的最佳实践.性能优化类的书.记录下主要知识. 加载和执行 脚本位置 放在<head>中的javasc ...

随机推荐

  1. spring3mvc与struts2比较

    目前企业中使用SpringMvc的比例已经远远超过Struts2,那么两者到底有什么区别,是很多初学者比较关注的问题,下面我们就来对SpringMvc和Struts2进行各方面的比较: 1. 核 心控 ...

  2. Linux中cat、more、less、tail、head命令的区别

    一.cat 显示文件连接文件内容的工具 cat 是一个文本文件(查看)和(连接)工具,通常与more搭配使用,与more不同的是cat可以合并文件.查看一个文件的内容,用cat比较简单,就是cat后面 ...

  3. Part of Speech Tagging

    Natural Language Processing with Python Charpter 6.1 suffix_fdist处代码稍微改动. import nltk from nltk.corp ...

  4. [iOS Animation]-CALayer 显示动画

    显式动画 如果想让事情变得顺利,只有靠自己 -- 夏尔·纪尧姆 上一章介绍了隐式动画的概念.隐式动画是在iOS平台创建动态用户界面的一种直接方式,也是UIKit动画机制的基础,不过它并不能涵盖所有的动 ...

  5. ucos调度器详解

    这一片谈谈关于ucos调度器的相关知识. ucos的调度器的实现主要靠一个函数OS_Sched 该函数将调度器的行为分为了两个部分,第一是调度部分,第二是任务切换部分,如下 void  OS_Sche ...

  6. android 后台服务定时通知

    最近有个项目的要求是在程序退出之后,任然可以每天定时发通知,我们可以想下,其实就是后台开一个服务,然后时间到了就发下通知. 1.首先我们需要用到Service类. 先上代码在慢慢解释 package ...

  7. ios开发中全局变量设置和调用方法

    ios开发中,全局变量设置和调用方法如下:在AppDelegate.h文件中设置全局变量:@interface ***AppDelegate{NSString *myName;}@property ( ...

  8. Zookeeper的基本概念

    Reference:  http://mp.weixin.qq.com/s?src=3&timestamp=1477979201&ver=1&signature=bBZqNrN ...

  9. zend framework 配置连接数据库

        Zend_Db_Adapter是zend frmaeword的数据库抽象层api.基于pdo, 你可以使用Zend_Db_Adapter连接和处理多种 数据库,包括:microsoft SQL ...

  10. JVM面试

    深入理解Java内存模型:http://www.cnblogs.com/skywang12345/p/3447546.html http://www.infoq.com/cn/articles/jav ...