IE特有滤镜:<div style=" width: 154px; height: 202px; " id="layer1">
<img src="<a href="http://gdsgj.edu.topzj.com/data/edu/26/59/01/customavatars/11/89/11894.png" target="_blank">http://gdsgj.edu.topzj.com/data/edu/26/59/01/customavatars/11/89/11894.png</a>" width="119" height="120">
<img src="<a href="http://gdsgj.edu.topzj.com/data/edu/26/59/01/customavatars/11/89/11894.png" target="_blank">http://gdsgj.edu.topzj.com/data/edu/26/59/01/customavatars/11/89/11894.png</a>" style='filter:flipv() Alpha(startX=77, startY=0, finishX=77, finishY=202,style=1,opacity=25,finishOpacity=0)' width="119" height="120">
</div>
支援FF:
<!DOCTYPE HTML PUBLIC#"-//W3C/DTD HTML 4.0//EN" "<a href="http://www.w3c.org/tr/html4/strict.dtd" target="_blank">http://www.w3c.org/tr/html4/strict.dtd</a>">
<html><head><title></title>
<style>
#aa{position:relative;width:128px;height:168px}
</style>
<script language="javascript">
function aab(){
aaa=""
ja=""
for(i=129,a=40;i<168;i++,a--){
ja+="<div style='overflow:hidden;width:128px;height:1px;position:absolute;top:"+i+"px;left:0px;filter:alpha(opacity="+a+");opacity:"+(a/100)+"'><img src='<a href="http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg" target="_blank">http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg</a>' style='margin:-"+(128-(i-128))+"px 0px 0px 0px'></div>"
}
aa.innerHTML+=ja
}
</script>
<body onload="aab()">
<div id="aa"><img src="<a href="http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg" target="_blank">http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg</a>" width="128" height="128"></div>
</body>
</html>
其他效果:
<!DOCTYPE HTML PUBLIC#"-//W3C/DTD HTML 4.0//EN" "<a href="http://www.w3c.org/tr/html4/strict.dtd" target="_blank">http://www.w3c.org/tr/html4/strict.dtd</a>">
<html><head><title></title>
<style>
#aa{position:relative;width:128px;height:168px}
</style>
<script language="javascript">
function aab(){
aaa=""
ja=""
for(i=129,a=40;i<168;i++,a--){
ja+="<div style='overflow:hidden;width:128px;height:1px;position:absolute;top:"+i+"px;left:"+(i-129)+"px;filter:alpha(opacity="+a+");opacity:"+(a/100)+"'><img src='<a href="http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg" target="_blank">http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg</a>' style='margin:-"+(128-(i-128))+"px 0px 0px 0px'></div>"
}
aa.innerHTML+=ja
}
</script>
<body onload="aab()">
<div id="aa"><img src="<a href="http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg" target="_blank">http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg</a>" width="128" height="128"></div>
</body>
</html>
這種效果也不錯:
<!DOCTYPE HTML PUBLIC#"-//W3C/DTD HTML 4.0//EN" "<a href="http://www.w3c.org/tr/html4/strict.dtd" target="_blank">http://www.w3c.org/tr/html4/strict.dtd</a>">
<html><head><title></title>
<style>
#aa{position:relative;width:128px;height:168px}
</style>
<script language="javascript">
function aab(){
aaa=""
ja=""
for(i=129,a=40;i<168;i++,a--){
ja+="<div style='overflow:hidden;width:128px;height:1px;position:absolute;top:"+(257-i)+"px;left:"+(i-129)+"px;filter:alpha(opacity="+a+");opacity:"+(a/100)+"'><img src='<a href="http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg" target="_blank">http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg</a>' style='margin:-"+(256-i)+"px 0px 0px 0px'></div>"
}
aa.innerHTML+=ja
}
</script>
<body onload="aab()">
<div id="aa"><img src="<a href="http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg" target="_blank">http://www.wowbox.com.tw/blog/attachments/month_0802/q200822422940.jpg</a>" width="128" height="128"></div>
</body>
</html>
暂无评论