19
Nov.2008
滑过变色,可以用A的hover,但有些时候,并不是整行加A标签,或者前面加了Icon之类,这类的滑过可以用以下的方法,鼠标滑过,滑出时加载不同的CSS类。从而产生变色或者其他效果。
css----------------------------------------------
.user01R04 li{background: url(heidian.gif) no-repeat 4px ;padding-left:15px; border-bottom:1px dotted #cccccc; overflow-y:hidden; }
.user01R04 .over{ background: url(heidian.gif) no-repeat 4px #f1fafc; }
.yellow1202,.yellow1202 a,.yellow1202 a:link,.yellow1202 a:visited,.yellow1202 a:active{ color:#b78d00;}
Html--------------------------------------------
<ul class="user01R04">
<li onMouseOver="this.className='over'" onMouseOut="this.className='none'"><a href="#">个人资料</a> (未上传头像) </li>
<li class="yellow1202" onMouseOver="this.className='over'" onMouseOut="this.className='yellow1202'"><a href="#">我的游戏</a></li>
<li onMouseOver="this.className='over'" onMouseOut="this.className='none'"><a href="#">我的好友</a></li>
<li onMouseOver="this.className='over'" onMouseOut="this.className='none'"><a href="#">帐号充值</a></li>
<li onMouseOver="this.className='over'" onMouseOut="this.className='none'"><a href="#">消息中心</a></li>
<li class="yellow1202" onMouseOver="this.className='over'" onMouseOut="this.className='yellow1202'"><a href="#">进入论坛</a></li>
<li onMouseOver="this.className='over'" onMouseOut="this.className='none'"><a href="#">退出登录</a></li>
</ul>
css----------------------------------------------
.user01R04 li{background: url(heidian.gif) no-repeat 4px ;padding-left:15px; border-bottom:1px dotted #cccccc; overflow-y:hidden; }
.user01R04 .over{ background: url(heidian.gif) no-repeat 4px #f1fafc; }
.yellow1202,.yellow1202 a,.yellow1202 a:link,.yellow1202 a:visited,.yellow1202 a:active{ color:#b78d00;}
Html--------------------------------------------
<ul class="user01R04">
<li onMouseOver="this.className='over'" onMouseOut="this.className='none'"><a href="#">个人资料</a> (未上传头像) </li>
<li class="yellow1202" onMouseOver="this.className='over'" onMouseOut="this.className='yellow1202'"><a href="#">我的游戏</a></li>
<li onMouseOver="this.className='over'" onMouseOut="this.className='none'"><a href="#">我的好友</a></li>
<li onMouseOver="this.className='over'" onMouseOut="this.className='none'"><a href="#">帐号充值</a></li>
<li onMouseOver="this.className='over'" onMouseOut="this.className='none'"><a href="#">消息中心</a></li>
<li class="yellow1202" onMouseOver="this.className='over'" onMouseOut="this.className='yellow1202'"><a href="#">进入论坛</a></li>
<li onMouseOver="this.className='over'" onMouseOut="this.className='none'"><a href="#">退出登录</a></li>
</ul>
沈秋寒
2009/03/28 11:35
麻烦了,直接写hover写background属性就可以了。
[?]小猪飞飞 回复于 2009/03/28 17:48
你说也能实现内容的方法,但我要实现的是,鼠标滑过滑出,加载不同CSS类的效果.
分页: 1/1
1
1











Web服务器配置
Png透明的CSS写法

