Chinaunix首页 | 论坛 | 博客
  • 博客访问: 3051417
  • 博文数量: 153
  • 博客积分: 8010
  • 博客等级: 中将
  • 技术积分: 1680
  • 用 户 组: 普通用户
  • 注册时间: 2006-04-02 10:43
个人简介

IT精英-请移步http://www.ithtu.com

文章分类

全部博文(153)

文章存档

2011年(3)

2010年(5)

2009年(17)

2008年(20)

2007年(76)

2006年(32)

我的朋友

分类:

2007-08-24 17:27:22

我们在上网的时候,常常会见到一种图片渐显的效果:在正常状态下,图片呈低透明的状态,即透明度比较低看上去是一种朦胧的效果,而当鼠标移上去的时候,图片渐渐的显示的清晰起来。这样的效果是怎么做出来的呢,我们今天来看这个实例。
  要实现这样的效果,仅是用CSS是完成不了的,需要通过JavaScript来进行控制。我们看下面的JavaScript脚本:

function high(which2){
theobject=which2
highlighting=setInterval("highlightit(theobject)",40)
}
function low(which2){
clearInterval(highlighting)
which2.filters.alpha.opacity=40
}
function highlightit(cur2){
if (cur2.filters.alpha.opacity<100)
cur2.filters.alpha.opacity =5
else if (window.highlighting)
clearInterval(highlighting)
}

这段脚本实现了图片的渐渐显示的清晰。我们在插入图片的代码中,将图片的初始透明底设置的低一些,并设置鼠标事件,可以触动脚本的运行。看下面的代码:


在上面的代码中:style='FILTER: alpha(opacity=20)' 即设置了图片的初始透明度。
阅读(772) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~