问题描述

web,大神看看这个功能怎么实现的。

http://vhello.cn/
公告下方的，鼠标移动上去后显示其他颜色。这是html5的吗？

解决方案

 <dl class="clearfix">
            <dd class="vborder">
                <a href="/index.php?g=Home&amp;m=Index&amp;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&amp;m=Index&amp;a=fc">
                    <div class="fimg icon member"></div>
                    <h3>微会员</h3>
                </a>
                <p>方便携带&nbsp;永不挂失<br>消费积分&nbsp;一卡配备</p>
            </dd>
            <dd class="vborder">
                <a href="/index.php?g=Home&amp;m=Index&amp;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&amp;m=Index&amp;a=fc">
                    <div class="fimg icon Push"></div>
                    <h3>微推送</h3>
                </a>
                <p>无线周边推广<br>提高品牌知名度</p>
            </dd>
            <dd class="">
                <a href="/index.php?g=Home&amp;m=Index&amp;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>

解决方案二：

http://vhello.cn/tpl/Home/laoyang/common/css/img/icon.png
它是js切换的，有两排图标，一个灰色的，一个蓝色的。

解决方案三：

:hover样式而已，然后设置样色和背景图片的位置（background-position）

解决方案四：

这中图标不能自定义吗？还是有图标库？

解决方案五：

有没有实例代码呀？用图片做背景就好。。。

解决方案六：

one
已经实现，这种方法更简单。

解决方案七：

one

解决方案八：

 <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>

解决方案九：

你说的是这个吗？http://vhello.cn/tpl/Home/laoyang/common/css/img/icon.png

解决方案十：

CSS3的:hover选择器