jQuery演示8种不同的图片遮罩层动画效果

查看演示 下载资源 下载积分： 20 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

图片导航菜单html

<ul id="sti-menu" class="sti-menu">
    <li data-hovercolor="#37c5e9">
        <a href="#">
            <h2 data-type="mText" class="sti-item">Advanced Patient Care</h2>
            <h3 data-type="sText" class="sti-item">Personalized to your needs</h3>
            <span data-type="icon" class="sti-icon sti-icon-care sti-item"></span>
        </a>
    </li>
    <li data-hovercolor="#ff395e">
        <a href="#">
            <h2 data-type="mText" class="sti-item">Alternative Medicine</h2>
            <h3 data-type="sText" class="sti-item">Holistic approaches</h3>
            <span data-type="icon" class="sti-icon sti-icon-alternative sti-item"></span>
        </a>
    </li>
</ul>

引入相关插件

<script type="text/javascript" src="http://libs.useso.com/js/jqueryui/1.8.13/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.iconmenu.js"></script>

调用iconmenu图标菜单插件

$('#sti-menu').iconmenu();