页面模板内容
<!DOCTYPE html> <html lang="zh"> <head> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta charset="utf-8"> <title><?php echo ReturnClassAddField(0,"seotitle");?></title> <meta name="keywords" content="[!--pagekey--]"> <meta name="description" content="[!--pagedes--]"> <link rel="stylesheet" rel="external nofollow" > </head> <body> <div class="head_about">[!--temp.header--]</div> <div class="bannProOuter"><div class="bannPro"><ul><li><a class="current" rel="external nofollow" ><?=$class_r[1][classname]?></a></li></ul></div></div> <div class="proOuter"><div class="proInner clearfix"> <div class="proSort"> <ul> [e:loop={"select classid,classname,classpath from phome_enewsclass where classid in (7,8,9,10,11) order by classid asc",0,24,0}] <?php if($bqno==5){ echo '<li class="lastChild">'; }else{ echo "<li>"; } $titleclass=""; if($bqr[classid]==$GLOBALS[navclassid]){ $titleclass="current"; } ?> <a rel="external nofollow" class="<?=$titleclass?>"><?=$bqr[classname]?></a></li> [/e:loop] </ul> </div> <div class="selectNumberScreen"><div class="screenBox"><?=user_ShowFieldandChange()?></div></div> <div class="proList clearfix"><ul>[!--empirenews.listtemp--]<!--list.var1-->[!--empirenews.listtemp--]</ul></div> <div class="page2 txtC">[!--show.listpage--]</div> </div></div> [!--temp.footer--] <script type="text/javascript"> $(".proList .photo").hover(function(){$(this).find(".txt").stop().animate({height:"300px"},300);},function(){$(this).find(".txt").stop().animate({height:"0px"},300);}); </script> </body> </html>
列表内容模板(list.var)
$nomar=""; if($no%4==0){$nomar=" class=\"nomar\"";}else{$nomar="";} if($r[titlepic]){$tpic=sys_ResizeImg($r[titlepic],300,300,1,"");}else{$tpic="/e/data/images/notimg.gif";} $listtemp='<li'.$nomar.'><div class="photo"><img src="'.$tpic.'"><a rel="external nofollow" rel="external nofollow" rel="external nofollow" ><div class="txt"><h3>查看<br>详情</h3></div></a></div> <b><a rel="external nofollow" rel="external nofollow" rel="external nofollow" >[!--title--]([!--model--])</a></b> <a rel="external nofollow" rel="external nofollow" rel="external nofollow" class="icon-thumbs-up" data-classid="[!--classid--]" data-id="[!--id--]"><em>[!--diggtop--]</em>人赞过</a></li>'; 最后在底部模板里或JS文件中加入以下js代码,大功告成 [html] view plain copy print? <script type="text/javascript"> $(".icon-thumbs-up").click(function(event){ event.preventDefault(); var mythis = $(this); var classid = mythis.data("classid"); var id = mythis.data("id"); $.ajax({ type:"GET", url:"[!--news.url--]e/public/digg/", data:{"classid":classid,"id":id,"dotop":1,"doajax":1,"ajaxarea":"diggnum"}, dataType:"text", success:function(data){ var reinfo = data.split("|"); if (reinfo.length != 1) { if (reinfo[0] != "") { mythis.find("em").html(reinfo[0]); } if (reinfo[2] != "") { //var left = parseInt(mythis.offset().left)+20, top = parseInt(mythis.offset().top); var left = 20, top = mythis.find("em").get(0).offsetHeight; $(".zan").remove(); if (reinfo[2] == "谢谢您的支持") { mythis.append('<div class="zan">+1 谢谢您的支持</div>'); //$("body").append('<div class="zan">+1 谢谢您的支持</div>'); }else{ mythis.append('<div class="zan">已赞</div>'); //$("body").append('<div class="zan">已赞</div>'); } //"text-shadow":"0 1px 0 rgba(0,0,0,0.5)","font-family":"simsun" $(".zan").css({"position":"absolute","z-index":"10","left":left+"px","top":-top+"px","color":"inherit"}).animate({top:-top-30},"slow",function(){$(this).fadeIn("fast").remove();}); } }else{} } }); }); </script>
总结
以上所述是小编给大家介绍的帝国cms首页列表页实现点赞功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
标签:帝国CMS
相关阅读 >>
帝国CMS文章内容tags关键词设置调用方法以及tags静态化实现方法
帝国CMS 获取一周的信息(默认时间是整形的也就是unix_timestamp)
更多相关阅读请进入《帝国CMS》频道 >>