帝国CMS文章内容页digg(点赞)代码实例
不是新知识(技术),只是为了记录,以后方便使用。
首先要把默认对js加上:
<script type="text/javascript" src="[!--news.url--]e/data/js/ajax.js"></script>
接下来是html代码:
<div class="ho-show-digg"> <p>这篇文章有帮助吗?</p> <p> <a href="JavaScript:makeRequest('[!--news.url--]e/public/digg/?classid=[!--classid--]&id=[!--id--]&dotop=1&doajax=1&ajaxarea=diggnum','EchoReturnedText','GET','');"><i class="fa fa-check"></i> 是</a> <em><i class="fa fa-close"></i> 否</em> </p> <p>已有 <span id="diggnum"><script src=[!--news.url--]e/public/ViewClick/?classid=[!--classid--]&id=[!--id--]&down=5></script></span> 人觉得有帮助</p> <p>还有其它问题?<a href="#">提交请求</a></p></div>
css如下:
.ho-show-digg{ margin:3rem 0 1rem; padding:1rem 0; text-align:center; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}.ho-show-digg p:nth-child(2) a,.ho-show-digg p:nth-child(2) em{ padding:.5rem 2rem; margin:0 .5rem; border:1px solid #285980; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}.ho-show-digg p:nth-child(2) a:hover,.ho-show-digg p:nth-child(2) em:hover{ color:#fff; background:#285980; transition: all .5s ease-out; cursor:pointer;}.ho-show-digg p:nth-child(3){ font-size: 0.875rem;}.ho-show-digg p:last-child{ margin:2rem 0 0;}.ho-show-digg p:last-child a:hover{ text-decoration: underline;}
转载请注明: » 帝国CMS文章内容页digg(点赞)代码实例