【锋利的JQuery-学习笔记】添加提示图片

效果图：

hot图片：（注意：这个图标本身就有抖动效果的，并不是由于标签<del>而具有抖动效果）

周期性抖动，起到提示的作用

html：

                    <div class="jnCatainfo">

                        <h3>推荐品牌</h3>

                        <ul>

                            <li><a href="#nogo" >耐克</a></li>

                            <li><a href="#nogo" class="promoted">阿迪达斯</a></li>

                            <li><a href="#nogo" >达芙妮</a></li>

                            <li><a href="#nogo" >李宁</a>

                            <li><a href="#nogo" >安踏</a></li>

                            <li><a href="#nogo" >奥康</a></li>

                            <li><a href="#nogo" class="promoted">骆驼</a></li>

                            <li><a href="#nogo" >特步</a></li>

                        </ul>

css：

.jnCatainfo li a.promoted{

    color:#F9044E;

}

.jnCatainfo li .hot {

    background: url("../images/hot.gif") no-repeat scroll 0 0 transparent;

    height: 16px;

    position: absolute;

    top:;

    width: 21px;

}

js：

/* 添加hot显示 */

$(function(){

    //$(".jnCatainfo .promoted").append('<s class="hot"></s>');

    $(".jnCatainfo .promoted").append('<del class="hot"></del>');

})

巴特西

【锋利的JQuery-学习笔记】添加提示图片

最新文章

热门文章