| 巧妙实现图片链接的特殊效果 |
|---|
|
| http://www.sina.com.cn 2002/05/16 10:27 赛迪网 |
|
|
文/touch8 图片链接效果多种多样，如采用彩色边框形式，一般的制作方法是建立几个CSS样式，然后用
onmouseover和
onmouseout分别调用或者用
a:hover调用，这样做的缺点是边框的颜色固定，缺乏变化。下面我介绍的这个方法可以产生多彩的边框，请看实际效果：
一、在
<head>部位建立CSS样式。
<style>
body img{border:1px solid
white}
</style> |
二、在
<head>插入下列代码：
<script
language="JavaScript">
var color;
var i
function
change(i){
var a=Math.random()*255;
var
b=Math.random()*255;
var
c=Math.random()*255;
color="rgb("+a+","+b+","+c+")";
var
source=event.srcElement;
if
(source.tagName=="IMG")
source.style.border="1px solid
"+i+""
}
</script> |
三、在
<body>中写入：
| onmouseover="change(color)"
onmouseout="change('white')" |
四、插入图片并做好链接。
代码不多！稍微修改一下还可以作成其他效果，如下：
|
|
|
|
版权所有 四通利方 新浪网