css+filter完成简易的照片全透明实际效果

日期:2021-03-06 类型:科技新闻 

关键词:微信公众号平台小程序,微信打分小程序,小程序发布,小程序大全,微信小程序编程

进行简易的全透明度操纵作用

应用filter的作用对照片元素开展全透明度操纵。

适用IE8,Chrome访问器。


拷贝编码
编码以下:

<style type='text/css'>
/*全透明20%*/
.opacity⑵0 {
filter:alpha(opacity=20); /*适用IE访问器的filter*/
-webkit-filter:opacity(0.2); /*适用chrome访问器filter*/
}
/*不全透明*/
.opacity⑴00 {
filter:alpha(opacity=100);
-webkit-filter:opacity(1);
}
</style>
<script language="javascript">
function makevisible(cur,which){
//更替设定不带全透明度和带全透明度的css
//进行电脑鼠标移进照片则不全透明显示信息,电脑鼠标移出则带全透明度显示信息
if (which==0) {
cur.className = 'opacity⑴00';
}else{
cur.className = 'opacity⑵0';
}
}
</script>
<img src="final.bmp" border=1 onMouseOver="makevisible(this,0)" onMouseOut="makevisible(this,1)" alt="">

以上便是本文的所有內容了,编码很简约,完成的实际效果却十分好,期待对大伙儿能所协助。

上一篇:CSS强制性换行对齐的完成方式 返回下一篇:没有了