滑動門特效 手指下滑,也可以異步加載更多 大家可以參考這個文件 `\template\member_style\default\member\user\index.htm` 示范代碼如下 默認是兩個按鈕, 不同的頻道 ,你可以添加多個按鈕 ~~~ <style type="text/css"> .bbs_title h3{ width:50%; float:left; color:#999; border-bottom:#ddd 1px solid; } .bbs_title h3 i{ color:#999; } .bbs_title h3.ck i{ color:#F90; } .bbs_title h3.ck{ color:#f90; border-bottom:#f90 1px solid; } </style> <div class="SideInfos"> <div class="bbs_title"> <!--這里可以是多個TAB按鈕--> <h3 class="ck"><i class="fa fa-fw fa-file-text-o"></i>我發表的主題</h3> <h3><i class="fa fa-fw fa-file-text-o"></i>我回復的貼子</h3> </div> <!--上面若有多個TAB按鈕,那下面也要對應多個,必須要命名為了 class="show_content" 其中的 bbs_content_reply 為的是異步加載用的, 可以不使用 --> <div class="show_content"> {qb:tag name="wap_member_homepage_002" union="uid" type="bbs" rows="5" mid="1" order="id" by="desc"} <ul> <ol style="width:80%;"><span>{$i}</span>、<a href="{$rs.url}">{$rs.title|get_word=24}</a></ol><li>{:date("m-d",$rs.create_time)}</li></ul> {/qb:tag} </div> <div class="show_content bbs_content_reply" style="display:none;"> <!--下面的標簽添加js="bbs_content_reply"參數為的就是不影響頁面打開速度。js名必須要與外層class名一樣,但可以不與標簽名一樣--> {qb:tag name="wap_member_homepage_reply_002" js="bbs_content_reply" union="uid" type="cms" rows="5" mid="1" order="id" by="asc"} <ul> <ol style="width:80%;"><span>{$i}</span>、<a href="{$rs.url}">{$rs.title|get_word=24}</a></ol><li>{:date("m-d",$rs.create_time)}</li></ul> {/qb:tag} </div> </div> <script type="text/javascript"> var type_num = 0; //默認是第一項 $(document).ready(function () { $(".bbs_title h3").click(function(){ $(".bbs_title h3").removeClass('ck'); $(this).addClass('ck'); type_num = $(this).index(); $(".SideInfos .show_content").hide(); $(".SideInfos .show_content").eq(type_num).show(); scroll_get = true; //避免其它加載完了,這里卻無法加載 }); }); var Mpage = new Array(); //頁碼數組 var urldb = new Array('{qb:url name="wap_member_homepage_002" /}','{qb:url name="wap_member_homepage_reply_002" /}'); //不同的URL function ShowMoreBBs(){ if( typeof Mpage[type_num]=='undefined' ){ Mpage[type_num] = 1; } Mpage[type_num]++; var url = urldb[type_num] + Mpage[type_num]; $.get(url,function(res){ if(res.code==0){ if(res.data==''){ layer.msg("已經顯示完了！",{time:500}); }else{ $(".SideInfos .show_content").eq(type_num).append(res.data); set_i_num(); scroll_get = true; } }else{ layer.msg(res.msg,{time:2500}); } }); } //滾動顯示更多 var scroll_get = true; //做個標志,不要反反復復的加載 $(document).ready(function () { $(window).scroll(function () { if (scroll_get==true && (400 + $(window).scrollTop())>($(document).height() - $(window).height())) { scroll_get = false; layer.msg('內容加截中,請稍候',{time:1000}); ShowMoreBBs(); } }); }); //設置標題序號 function set_i_num(){ var j = 0; $(".SideInfos .show_content").eq(type_num).find('ul span').each(function(){ j++; $(this).html(j); }); } </script> ~~~ **下面圖文部分由 suifeng 于2019年6月25日進行修編。**   關鍵點就是上面的復制完成后 js部分這里也要加上對應的url即可 ~~~ var?urldb?=?new?Array('{qb:url?name="wap_member_homepage_002"?/}','{qb:url?name="wap_member_homepage_reply_002"?/}','{qb:url?name="wap_member_homepage_reply_003"?/}','{qb:url?name="wap_member_homepage_reply_004"?/}');?//不同的URL ~~~