Load thêm nội dung sb khi kéo chuột xuống cuối trang

**thaian2009** · 14.09.2015 / 14:10

- Cái này của gek mình sửa lại lấy phần chức năng thôi. Làm biếng viết

- Bỏ phần hiện thông báo đang tải, hết bài, đăng bài không load trang

Ô 1 sb

TWIG

<script type="text/javascript" src="/files/1020011/jquery.min.js"></script>
{%set trang= paging_def|split('<i class="stong" style="display:none">')[1]|split('</i>')[0]%}
 
 <form action="{{form_url}}" method="post"> <textarea rows="3" cols="20" name="text" style="width:auto"></textarea><br/> 
 <input type="submit" value="Thêm tin nhắn"/></form> 
<div class="tinnhans" page="{{trang}}">{{message_list}}
  </div>
<span id="load_main_msg"></span>
<style type="text/css">
  .tinnhan{padding:3px;border:1px solid gray;background-color:#efefef;margin:1px;border-radius:1px}
  body{max-width:800px;margin:auto;border:1px solid #efefef;border-radius:4px;box-shadow:0px 0px 1px gray}
</style>
<script type="text/javascript">
window.onscroll = function() {kiemtra()};
trang=1;dk=true;
  function kiemtra()
  {
    var body = document.body, html = document.documentElement;
var height = Math.max( body.scrollHeight, body.offsetHeight,html.clientHeight, html.scrollHeight, html.offsetHeight );
    if(window.scrollY >=height-window.innerHeight){if(dk==true){trang=trang+1;taithem(trang);}else{console.log("-msS-data empty-");}}}
 
 
  function taithem(trang)
  {
   diachi='main.php?{{api.r.get("f") is not empty?'f='~api.r.get("f"):''}}&pusl0='+trang;
  $("#themtin").load(diachi+" .tinnhans", function (c) {
    if(trang+1 > $(c).find(".tinnhans").attr("page")){dk=false;}
        $("#load_main_msg").before($("#themtin").html());
    });
}
</script>
<div id="themtin" style="display:none"></div>

- Nhớ thay đúng pusl.

Ô 2 sb

TWIG

<div class="tinnhan">
{{nick}}: {{message}} 
</div>

- Để số tin nhắn là 10

Vào Thiết kế -> Thiết lập phân trang -> Khối mẫu ; thêm cái này vào cuối

TWIG

<i class="stong" style="display:none">%page_count%</i>

Demo: http://shoutboxgenerator.wap.m ... 14991

Nguồn: http://cobethoitiet.wap.mu && http://gek.wap.mu

**HuyAnh** · 14.09.2015 / 14:43

a lm s mk tự chèn vào sb của riêng mình đi a chèn v xấu lắm

**thaian2009** · 14.09.2015 / 14:44

Sửa style lại là dc mà =))

**phan_nam1999** · 14.09.2015 / 14:46

s ko load nhi ?

**thaian2009** · 14.09.2015 / 14:54

Hướng dẫn cách sửa với sb của bạn.

Cái này đặt ở header wap

HTML5

<script type="text/javascript" src="/files/1020011/jquery.min.js"></script>

Cái này đặt đầu ô 1 sb

TWIG

{%set trang= paging_def|split('<i class="stong" style="display:none">')[1]|split('</i>')[0]%}

Cái này bao quanh {{message_list}}

TWIG

<div class="tinnhans" page="{{trang}}">{{message_list}}</div>

Cái này ở dưới {{message_list}}

HTML5

<span id="load_main_msg"></span>

Cái này để head hay footer cũng dc

HTML5

<style type="text/css">
  .tinnhan{padding: 3px;border:1px solid gray;background-color:#efefef;margin:1px;border-radius:1px}
  body{max-width:800px;margin:auto;border:1px solid#efefef;border-radius:4px;box-shadow:0px 0px 1px gray}
</style>

Cái này để ở cuối ô 1 sb hoặc footer trang

HTML5

<script type="text/javascript">
window.onscroll = function() {kiemtra()};
trang=1;dk=true;
  function kiemtra()
  {
    var body = document.body, html = document.documentElement;
var height = Math.max( body.scrollHeight, body.offsetHeight,html.clientHeight, html.scrollHeight, html.offsetHeight );
    if(window.scrollY >=height-window.innerHeight){if(dk==true){trang=trang+1;taithem(trang);}else{console.log("-msS-data empty-");}}}
 
 
  function taithem(trang)
  {
   diachi='main.php?{{api.r.get("f") is not empty?'f='~api.r.get("f"):''}}&pusl0='+trang;
  $("#themtin").load(diachi+" .tinnhans", function (c) {
    if(trang+1 > $(c).find(".tinnhans").attr("page")){dk=false;}
        $("#load_main_msg").before($("#themtin").html());
    });
}
</script>
<div id="themtin" style="display:none"></div>

Cái này bao quanh nội dung ở ô 2 sb

HTML5

<div class="tinnhan">

Good luck! troll

**HuyAnh** · 14.09.2015 / 15:07

hk dk

**thaian2009** · 14.09.2015 / 15:18

Không test dc hay không dùng dc :/

**HuyAnh** · 14.09.2015 / 15:25

hk dùng dk sb lỗi hết phải gỡ hết code

**phan_nam1999** · 14.09.2015 / 15:31

sb không lỗi nhưng không load đc.

**hanhphucao** · 14.09.2015 / 15:35

:yeah: