帝国cms赞一下代码

利用帝国cms的顶字段，实现赞一下。相关代码如下。保留备用。

html代码    

   <!--  点赞 begin  -->
   <div id="like" class="loading">
	<div class="bdlikebutton bdlikebutton-green bdlikebutton-medium bdlikebutton-medium-green"  data-id="[!--id--]" data-classid="[!--classid--]">
		<div class="bdlikebutton-inner">
			<span class="bdlikebutton-add">+1</span>
			<div class="bdlikebutton-count">100</div>
			<div class="bdlikebutton-text">赞一下</div>
		</div>
	</div><!--  点赞 end  -->

css代码

/* dian  zan   */
.bdlikebutton {
    background: url(http://bdimg.share.baidu.com/static/images/like.png?cdnversion=20120824) no-repeat;
    position: relative;
    cursor: pointer;
    text-align: center;
    font-size: 12px;
}
.bdlikebutton-green {
    color: #127B03;
}
.bdlikebutton-medium {
    width: 105px;
    height: 51px;
}

.bdlikebutton-medium-green {
    background-position: 0 -230px;
}
.bdlikebutton-inner {
    overflow: hidden;
}
.bdlikebutton-add {
    display: none;
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 10002;
    font-size: 20px;
    font-weight: 700;
}

.bdlikebutton-medium .bdlikebutton-count {
    margin-top: 8px;
    padding: 2px 0 0 20px;
    line-height: 15px;
    background: url(http://bdimg.share.baidu.com/static/images/like.png?cdnversion=20120824) no-repeat;
    display: inline-block;
}

.bdlikebutton-medium-green .bdlikebutton-count {
    background-position: -280px -60px;
}
.bdlikebutton-medium .bdlikebutton-text {
    line-height: 22px;
}
.bdlikebutton-medium-green-hover .bdlikebutton-count{background-position:-280px -660px;}
.bdlikebutton-medium-green-hover{background-position:-110px -230px;color:#FFF;}

js代码：

// 赞一下
(function ($) { 
    $.extend({ 
        tipsBox: function (options) { 
            options = $.extend({ 
                obj: null,  //jq对象，要在那个html标签上显示 
                str: "+1",  //字符串
                startSize: "12px",  //动画开始的文字大小 
                endSize: "30px",    //动画结束的文字大小 
                interval: 900,  //动画时间间隔 
                color: "red",    //文字颜色 
                callback: function () { }    //回调函数 
            }, options); 
            $("body").append("<span class='num'>" + options.str + "</span>"); 
            var box = $(".num"); 
            var left = options.obj.offset().left + options.obj.width() / 2; 
            var top = options.obj.offset().top - options.obj.height(); 
            box.css({ 
                "position": "absolute", 
                "left": left + "px", 
                "top": top + "px", 
                "z-index": 9999, 
                "font-size": options.startSize, 
                "line-height": options.endSize, 
                "color": options.color 
            }); 
            box.animate({ 
                "font-size": options.endSize, 
                "opacity": "0", 
                "top": top - parseInt(options.endSize) + "px" 
            }, options.interval, function () { 
                box.remove(); 
                options.callback(); 
            }); 
        } 
    }); 
})(jQuery); 
	

效果见网站：   http://www.wenxuewang.cn/wenxue/sanwen/148971.html