19.鼠标移过链接时实现特定响应-开店乐

1.在三个链接的代码中添加onMouseOver()语句 <a href="/pc/pcketang/index.htm" onMouseOver="swap(1)" class="p2">电脑交互教程</a> <a href="/pc/softdown/index.htm" onMouseOver="swap(2)" class="p2">共享软件下载</a> <a href="/pc/hangqing/index.htm" onMouseOver="swap(3)" class="p2">硬件追踪</a> 2.在html文件的“<head>”中添加如下JavaScript语句： <script language="JavaScript"> <!-- text=new Array(4); text[0]=new Image(); text[0].src="img/text0.gif"; text[1]=new Image(); text[1].src="img/text1.gif"; text[2]=new Image(); text[2].src="img/text2.gif"; text[3]=new Image(); text[3].src="img/text3.gif"; function swap(t) { if(t>0) document.TEXT0.src=text[t].src else document.TEXT0.src=text[0].src } //-－> </script>

　　这样的效果我们采用JavaScript很容易就能实现，下面我们来具体做一下：

　　1、把介绍性文字或图片制作成几幅高宽相同的gif图，上面例子中我们制作了四幅图，分别作为默认的图片和三个介绍性的图片，分别命名为text0-text3,然后我们把默认的图片插入固定位置，并给此图象对象命名为TEXT0；

　　2、然后在三个链接的代码中添加onMouseOver()语句，这个语句的作用是，当鼠标移动到链接上面时，让程序控制出现什么响应；我们在如下图的位置加入这样的语句：

　　其中swap()是一个函数，在下一步中将要定义它，我们分别在“电脑交互教程”的链接中加入“onMouseOver="swap(1)"”，在“共享软件下载”的链接中加入“onMouseOver="swap(2)"”，在“硬件追踪”的链接中加入“onMouseOver="swap(3)"”；

　　3、在html文件的“<head>”中添加如下JavaScript语句：

代码解释

　　好，做完以上的工作，我们在浏览器中就能看到如前面所示的效果了。提醒你的是并不是所有的浏览器都支持此效果，另外在你加入JavaScript语句的时候一定要注意区分大小写噢。你也可以利用此技巧的原理为网页增添其它的JnMouseOver响应效果。

【日期：2006-10-9】【作者：网上开店】【转载自：http://www.kaidianle.com】