注册/登录,欢迎光临!
加入收藏设为首页网站地图
您当前的位置:辛勤IT网 >> 页面特效 >> JavaScript >> 网页设计技巧-变换图片的菜单
热门:word | excel | powerpoint

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

2012/12/5 10:03:53 所属分类:页面特效 - JavaScript
内容提要:网页设计技巧-变换图片的菜单,这个菜单也象WINDOWS里的菜单,只不过是个错觉,其实它是用图片做的,但真的和WINDOWS里的菜单一样。

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

  这个菜单也象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、想想它的变化过程,充分发挥你的想象力,你可以做出各种奇妙的效果。

页面特效 | JavaScript
最近更新
推荐信息
关于我们 | 联系方式 | 对话本站 | 版权声明 | 所有信息