<html>

<head>

<script type="text/javascript">

function writeText(txt)

{

document.getElementById("desc").innerHTML=txt

}

</script>

</head>

<body>

<img src="/i/eg_planets.jpg" border="0" usemap="#planetmap" alt="Planets" />

<map name="planetmap" id="planetmap">

<area shape="circle" coords="180,139,14"

onMouseOver="writeText('直到 20 世纪 60 年代，金星一直被认为是地球的孪生姐妹，因为金星是离我们最近的行星，同时还由于两者拥有很多共同的特征。')"

href ="/example/html/venus.html" target ="_blank" alt="Venus" />

<area shape="circle" coords="129,161,10"

onMouseOver="writeText('从地球上是很难研究水星的，这是由于它和太阳的距离总是很近。')"

href ="/example/html/mercur.html" target ="_blank" alt="Mercury" />

<area shape="rect" coords="0,0,110,260"

onMouseOver="writeText('太阳和类似木星这样的气态行星是到目前为止太阳系中最大的物体。')"

href ="/example/html/sun.html" target ="_blank" alt="Sun" />

</map>

<p id="desc"></p>

</body>

</html>

使用map， area ， coords实现对图片上不同区域添加事件

<script type="text/javascript">

function timedMsg()

{

var t=setTimeout("alert('5 秒！')",5000)

}

</script>

5秒后执行弹出框显示5秒

<html>

<head>

<script type="text/javascript">

function timedText()

{

var t1=setTimeout("document.getElementById('txt').value='5 秒'",0)

var t2=setTimeout("document.getElementById('txt').value='4 秒'",1000)

var t3=setTimeout("document.getElementById('txt').value='3 秒'",2000)

var t2=setTimeout("document.getElementById('txt').value='2 秒'",3000)

var t3=setTimeout("document.getElementById('txt').value='1 秒'",4000)

var t3=setTimeout("document.getElementById('txt').value='开始'",5000)

}

</script>

</head>

<body>

<form>

<input type="button" value="显示倒计时" onClick="timedText()">

<input type="text" id="txt">

</form>

<p>点击上面的按钮。括号最后的数字代表逝去的时间。</p>

</body>

</html>

使用setTimeout实现倒计时效果

javascript 学习随笔2的更多相关文章

  1. javascript学习随笔(二)原型prototype

    JavaScript三类方法: 1.类方法:2.对象方法:3.原型方法;注意三者异同 例: function People(name){ this.name=name; //对象方法 this.Int ...

  2. javascript 学习随笔7

    <head> <title>标题页-学无忧(www.xue51.com)</title> <script language="JavaScript& ...

  3. javascript 学习随笔

    var carname="Volvo"; var carname; 重新声明变量后变量的值不变,在这里还是volvo var carname="Volvo"; ...

  4. javascript 学习随笔3

    <html> <head> <script type="text/javascript"> function startTime() { var ...

  5. javascript 学习随笔1

    html部分 <body onload="message()"><!--主题部分加载就调用-->document.getElementById(" ...

  6. javascript 学习随笔6

    改变html内容 document.getElementById("p1").innerHTML="New text!"; var element=docume ...

  7. JavaScript ES6 数组新方法 学习随笔

    JavaScript ES6 数组新方法 学习随笔 新建数组 var arr = [1, 2, 2, 3, 4] includes 方法 includes 查找数组有无该参数 有返回true var ...

  8. typeScript学习随笔（一）

    TypeScript学习随笔(一) 这么久了还不没好好学习哈这么火的ts,边学边练边记吧! 啥子是TypeScript  TypeScript 是 JavaScript 的一个超集,支持 es6 标准 ...

  9. jquery学习随笔

    转)jquery学习随笔(jquery选择器)   jQuery的选择器是CSS 1-3,XPath的结合物.jQuery提取这二种查询语言最好的部分,融合后创造出了最终的jQuery表达式查询语言. ...

随机推荐

  1. 打印 PHP $_SERVER 常量

    foreach( $_SERVER as $var => $value){ echo $var.' '.$value.'<br>'; };

  2. Myeclipse利用maven构建sping web项目

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQQAAADvCAIAAACbnj2oAAAfq0lEQVR4nO2d+1MUV9rH+294U9mqpG ...

  3. HTML5 appcache

    参考http://www.zation.me/2013/05/28/build_offline_mobile_web_app.html 他的事件总结的比较好 checking:客户端正在检查manif ...

  4. 射频识别技术漫谈(23)——ISO15693的载波、调制与编码

    射频识别技术中的通讯大多是主从式,主动方一般是读写器,被动方称为“卡片”或“标签”.到底是叫“卡片”还是“标签”,好像也没有严格的区分.习惯上可以从以下4个方面界定:一是形状,卡片通常体积较大,更像“ ...

  5. PHP查看在线服务器与本地服务器支持函数差别

    在本地开发好的程序.代码,当传到服务器后,经常会出现罢工的事情.这时候就要考虑开发环境和在线的环境是否完全一致了.这里所说的一致性,包括了容器的配置.php的配置等等.下面所要解决的只是其中一项,你的 ...

  6. HDU 3350 #define is unsafe

    题目大意:给定一个只含有MAX和+操作的式子,求加法运行了多少次,其中MAX使用宏定义. 题解:注意一个规律,对于MAX(A,B)其中A中加a次,B中加b次若A>B,则加a*2+b次,否则a+b ...

  7. VS2010/MFC设置对话框控件的Tab顺序

    设置对话框控件的Tab顺序 前面几节为大家演示了加法计算器程序完整的编写过程,本节主要讲对话框上控件的Tab顺序如何调整. 上一讲为“计算”按钮添加了消息处理函数后,加法计算器已经能够进行浮点数的加法 ...

  8. SVNserver的本地搭建和使用

    Subversion是优秀的版本号控制工具,其具体的的长处和具体介绍,这里就不再多说. 首先来下载和搭建SVNserver. 如今Subversion已经迁移到apache站点上了,下载地址: htt ...

  9. 在C#中使用 Win32 和其他库

    C# 用户经常提出两个问题:“我为什么要另外编写代码来使用内置于 Windows® 中的功能?在框架中为什么没有相应的内容可以为我完成这一任务?”当框架小组构建他们的 .NET 部分时,他们评估了为使 ...

  10. 用Aspose.Cells控件读取Excel

    Aspose是一个很强大的控件,可以用来操作word,excel,ppt等文件,用这个控件来导入.导出数据非常方便.其中Aspose.Cells就是用来操作Excel的,功能有很多.我所用的是最基本的 ...