网页技巧----变换图片的菜单

王朝html/css/js·作者佚名  2008-05-18
窄屏简体版  字體: |||超大  

网页技巧----变换图片的菜单

· fishs·转载自网易

这个菜单也象WINDOWS里的菜单,只不过是个错觉,其实它是用图片做的,但真的和WINDOWS里的菜单一样。跟我学吧。

<scriptlanguage="JavaScript">

<!--

if(document.images){

image1on=newImage();image1on.src="a01-1.gif";

image2on=newImage();image2on.src="a02-1.gif";

image3on=newImage();image3on.src="a03-1.gif";

image4on=newImage();image4on.src="a04-1.gif";

image1off=newImage();image1off.src="a01.gif";

image2off=newImage();image2off.src="a02.gif";

image3off=newImage();image3off.src="a03.gif";

image4off=newImage();image4off.src="a04.gif";

}

functionchangeImages(){

if(document.images){for(vari=0;i<changeImages.arguments.length;i

+=2){

document[changeImages.arguments[i]].src=eval(changeImages.arguments[

i+1]+".src");

}

}

}

//-->

</script>

说明:

1、将黄色代码加到<head>和</head>之间,还没完,接着往下看;

2、将图片的链接按如下改动:<ahref="链接文件.htm"onMouseOut="chan

geImages('image1','image1off')"onMouseOver="changeImages('image1','

image1on')"><imgsrc="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、想想它的变化过程,充分发挥你的想象力,你可以做出各种奇妙的效果。

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
 
© 2005- 王朝網路 版權所有 導航