分享一个js特效-可以当鼠标移动时改变边框颜色

找到了一个当鼠标移动到当前元素时,当前元素可以随机显示一个边框颜色,效果非常不错!

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“>
<html xmlns=”http://www.w3.org/1999/xhtml“>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>无标题文档</title>
<style>
img{border:3px solid white}
</style>
<SCRIPT language=JavaScript>
function change(){
var a=Math.random()*255;
var b=Math.random()*255;
var c=Math.random()*255;
var color=”rgb(“+a+”,”+b+”,”+c+”)”;
if(event.type==”mouseover”)
{
if (event.srcElement.tagName==”IMG”)
event.srcElement.style.border=”3px solid “+color
}
if(event.type==”mouseout”)
{
if (event.srcElement.tagName==”IMG”)
event.srcElement.style.border=”3px solid white”
}
}
</SCRIPT>
</head>

<body>

<a href=”1.htm”><img src=”1.gif” width=”200″ height=”200″  onmouseover=change() onmouseout=”change()”></a>
<a href=”2.htm”><img src=”1.gif” width=”200″ height=”200″  onmouseover=change() onmouseout=”change()”></a>

</body>
</html>

Leave a Reply