网页技巧
时间：2007-02-17 来源：PHP爱好者
网页技巧----变换图片的菜单
· fishs·转载自网易
这个菜单也象WINDOWS里的菜单，只不过是个错觉，其实它是用图片做的，但真的和WINDOWS里的菜单一样。跟我学吧。
<scriptlanguage="JavaScript">
<!--
if(document.images){
image1on=newImage();image1on.src="http://www.aspcool.com/lanmu/a01-1.gif";
image2on=newImage();image2on.src="http://www.aspcool.com/lanmu/a02-1.gif";
image3on=newImage();image3on.src="http://www.aspcool.com/lanmu/a03-1.gif";
image4on=newImage();image4on.src="http://www.aspcool.com/lanmu/a04-1.gif";
image1off=newImage();image1off.src="http://www.aspcool.com/lanmu/a01.gif";
image2off=newImage();image2off.src="http://www.aspcool.com/lanmu/a02.gif";
image3off=newImage();image3off.src="http://www.aspcool.com/lanmu/a03.gif";
image4off=newImage();image4off.src="http://www.aspcool.com/lanmu/a04.gif";
}
functionchangeImages(){
if(document.images){for(vari=0;i<changeImages.arguments.length;i
+=2){
document[changeImages.arguments].src=eval(changeImages.arguments[
i+1]+".src");
}
}
}
//-->
</script>
说明：
1、将黄色代码加到<head>和</head>之间，还没完，接着往下看；
2、将图片的链接按如下改动：<ahref="链接文件.htm"onMouseOut="chan
geImages('image1','image1off')"onMouseOver="changeImages('image1','
image1on')"><imgsrc="http://www.aspcool.com/lanmu/a04.gif"name="image1"width="126"height="28"b
order="0"></a>；
3、仔细看代码中的数字，有1、2、3、4就是图片的顺序，a01是灰底黑字，
a01-1是蓝底白字，其他同理；
4、每个图片的链接改动时，那个数字也要同样改动，1就是1，2就是2，链接
文件就不用我说了吧。好了，大功告成了。
5、想想它的变化过程，充分发挥你的想象力，你可以做出各种奇妙的效果。
非常全面的一个php技术网站,php爱好者站 http://www.phpfans.net 有相当丰富的文章和源代码.
· fishs·转载自网易
这个菜单也象WINDOWS里的菜单，只不过是个错觉，其实它是用图片做的，但真的和WINDOWS里的菜单一样。跟我学吧。
<scriptlanguage="JavaScript">
<!--
if(document.images){
image1on=newImage();image1on.src="http://www.aspcool.com/lanmu/a01-1.gif";
image2on=newImage();image2on.src="http://www.aspcool.com/lanmu/a02-1.gif";
image3on=newImage();image3on.src="http://www.aspcool.com/lanmu/a03-1.gif";
image4on=newImage();image4on.src="http://www.aspcool.com/lanmu/a04-1.gif";
image1off=newImage();image1off.src="http://www.aspcool.com/lanmu/a01.gif";
image2off=newImage();image2off.src="http://www.aspcool.com/lanmu/a02.gif";
image3off=newImage();image3off.src="http://www.aspcool.com/lanmu/a03.gif";
image4off=newImage();image4off.src="http://www.aspcool.com/lanmu/a04.gif";
}
functionchangeImages(){
if(document.images){for(vari=0;i<changeImages.arguments.length;i
+=2){
document[changeImages.arguments].src=eval(changeImages.arguments[
i+1]+".src");
}
}
}
//-->
</script>
说明：
1、将黄色代码加到<head>和</head>之间，还没完，接着往下看；
2、将图片的链接按如下改动：<ahref="链接文件.htm"onMouseOut="chan
geImages('image1','image1off')"onMouseOver="changeImages('image1','
image1on')"><imgsrc="http://www.aspcool.com/lanmu/a04.gif"name="image1"width="126"height="28"b
order="0"></a>；
3、仔细看代码中的数字，有1、2、3、4就是图片的顺序，a01是灰底黑字，
a01-1是蓝底白字，其他同理；
4、每个图片的链接改动时，那个数字也要同样改动，1就是1，2就是2，链接
文件就不用我说了吧。好了，大功告成了。
5、想想它的变化过程，充分发挥你的想象力，你可以做出各种奇妙的效果。
非常全面的一个php技术网站,php爱好者站 http://www.phpfans.net 有相当丰富的文章和源代码.
相关阅读 更多 +
