当前页面: 开发资料首页 → Javascript 专题 → “牵一发而动全局”onMouseover的灵活运用
“牵一发而动全局”onMouseover的灵活运用
摘要: “牵一发而动全局”onMouseover的灵活运用
很多有过页面制作经验的人,为了丰富页面的动感,在设计数量众多的按钮时,通常都喜欢采用onMouseover这个函数。其效果就是当鼠标划过按钮时,按钮看起来会有一种起伏变化,从而成为一种独特的信息提示。
关于onMouseover可以有四种基本的表现形式:一图对一图、一图对多图、多图对一图、多图对多图。下面就让我们一一道来:
一图控制一图
开题中我们提到的这种效果就是一图对一图,它仅仅控制图自身的变化。
当鼠标划过图a的时候便换成图c,当鼠标划过图b的时候便换成图d。因为图a与图c的不同,看起来就会有视觉上的动感。而这在现在的页面设计中也是最常用的一种动态效果。
代码如程序1所示范:
<head>
<script language=JavaScript>
var imgover= new Array(2);
var imgout=new Array(2);
for(i=1;i<=2;i++)
{
imgover[i]=firstb+i+.gif;
imgout[i]=firsta+i+.gif;
}
function over(i)
{
if(document.images)
document.images[image+i].src=imgover[i];
}
function out(i)
{
if(document.images)
document.images[image+i].src=imgout[i];
}
</script>
</head>
<body>
</body>