http://vhello.cn/
公告下方的,鼠标移动上去后显示其他颜色。这是html5的吗?
CSS3的:hover选择器
你说的是这个吗?http://vhello.cn/tpl/Home/laoyang/common/css/img/icon.png
http://vhello.cn/tpl/Home/laoyang/common/css/img/icon.png
它是js切换的,有两排图标,一个灰色的,一个蓝色的。
<dl class="clearfix">
<dd class="vborder">
<a href="/index.php?g=Home&m=Index&a=fc">
<div class="fimg icon website"></div>
<h3>微官网</h3>
</a>
<p>5分钟轻松建站<br>打造酷炫微官网</p>
</dd>
<dd class="vborder">
<a href="/index.php?g=Home&m=Index&a=fc">
<div class="fimg icon member"></div>
<h3>微会员</h3>
</a>
<p>方便携带 永不挂失<br>消费积分 一卡配备</p>
</dd>
<dd class="vborder">
<a href="/index.php?g=Home&m=Index&a=fc">
<div class="fimg icon activities"></div>
<h3>微活动</h3>
</a>
<p>吸引用户参与<br>增强用户沉淀</p>
</dd>
<dd class="vborder active">
<a href="/index.php?g=Home&m=Index&a=fc">
<div class="fimg icon Push"></div>
<h3>微推送</h3>
</a>
<p>无线周边推广<br>提高品牌知名度</p>
</dd>
<dd class="">
<a href="/index.php?g=Home&m=Index&a=fc">
<div class="fimg icon service"></div>
<h3>微服务</h3>
</a>
<p>提供生活服务<br>增加用户粘性</p>
</dd>
</dl>
js 实现
<script>
$(document).ready(function(){
$(".feature-content dd").hover(
function(){
$(this).addClass("active")
},
function(){
$(this).removeClass("active");
}
);
});
</script>
:hover样式而已,然后设置样色和背景图片的位置(background-position)
这中图标不能自定义吗?还是有图标库?
有没有实例代码呀?用图片做背景就好。。。
<a href=http://www.kmwzjs.com><img src="images/logo.jpg" onmouseover="this.src='images/h.jpg'" onmouseout="this.src='images/logo.jpg'" />one</a></div>