2025年3月19日 星期三 甲辰(龙)年 月十八 夜 设为首页 加入收藏
rss
您当前的位置:首页 > 计算机 > 服务器 > 万维网络 > 帝国cms

【帝国CMS】文章页digg(点赞)代码

时间:01-19来源:作者:点击数:32

不是新知识(技术),只是为了记录,以后方便使用。

首先要把默认对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;
  • }

效果:

方便获取更多学习、工作、生活信息请关注本站微信公众号城东书院 微信服务号城东书院 微信订阅号
推荐内容
相关内容
栏目更新
栏目热门