图片与文字半透明效果鼠标移上不透明

更新时间：2009年10月18日 00:58:20 作者：

图片与文字结合的半透明效果，在正常状态下，一张图片的上面显示文字，为了区分背景，文字下方又重新布置了一个DIV

该 DIV是半秀明状态，这样可以看到背景也可以衬托文字，当鼠标放到文字上的时候，DIV层彻底不透明，文字清淅显示出来，一般这种效果都是要配合JavaScript的，这样兼容性会更好。

<!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 type="text/css"> .box{ width:600px; height:600px; padding:20px;} *{ margin:0; padding:0;} body{ background:url(//img.jbzj.com/demoimg/200910/wall.gif) no-repeat; width:300px; height:235px;} .in_box{background:#fff; width:293px; background:rgba(255,255,255,0.4); filter:alpha(opacity=40); } .box .sub_con{ position:relative; color:#00F; width:100%;} .ff{background:#fff; width:293px; background:rgba(255,255,255,1); filter:alpha(opacity=100);} </style> </head> <body> <div class="box"> <div class="in_box" id="in_box"> <p class="sub_con">脚本之家（https://www.jb51.net）提供各类编程源码、书籍教程、JavaScript/CSS特效代码等，做有质量的学习型网站。</p> </div> </div> <script type="text/javascript"> var hh=document.getElementById('in_box'); var bb; hh.onmouseover=function(){ bb=this.className; this.className='ff'; } hh.onmouseout=function(){ this.className=this.className.replace('ff',bb); } </script> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

仿3721首页模块拖曳移动效果js代码[可拖曳层移动层]
比较不错的模仿3721的页面模块拖动效果代码
2008-09-09
js可拖动的后台界面
不错的后台界面，方便大家以后做后台
2008-07-07
js新浪首页可关闭背景效果代码
新浪首页可关闭背景效果代码，每逢过节或遇到重大节日，新浪等门户的首页都为以此为背景，改变风格与事件对应，当然了用户可选择关闭背景，你现在看到的这款代码就是实现背景的关闭，实用简单。
2010-11-11
网页打开自动最大化的js代码
有时候我们需要当页面打开时，自动最大化，一来方便用户浏览，而且快速将页面呈现给大家
2012-08-08
简洁的一个实现网页全屏代码
简洁的一个实现网页全屏代码...
2007-10-10
JS控制按钮自动切换背景颜色(可暂停)
JS控制按钮自动切换背景颜色，可暂停并且方便获取当前背景颜色,需要的朋友可以参考下
2012-10-10
javascript背景颜色按时变换
javascript背景颜色按时变换...
2007-05-05
JavaScript 拖拽翻页效果代码
拖动翻页代码，很多人都想拥有这样一个功能，现在于JavaScript配合CSS终于实现了，个人感觉真的很不错，按住鼠标左键向某一方向拖动即可完成分页动作，符合WEB标准，兼容多浏览器。
2010-03-03
图片与文字半透明效果鼠标移上不透明
图片与文字结合的半透明效果，在正常状态下，一张图片的上面显示文字，为了区分背景，文字下方又重新布置了一个DIV
2009-10-10
图片与JavaScript配合做出个性滚动条
如果你想定制出一个漂亮的滚动条的话,这个JS特效可能会适合你,不过代码稍嫌麻烦些,但效果真的不错,代码含有中文注释,学习也是不错的,希望朋友们喜欢.
2009-10-10