thinkPHP實現瀑布流的方法_PHP

來源:互聯網
上載者:User
關鍵字 thinkPHP 瀑布流
本文執行個體講述了thinkPHP實現瀑布流的方法。分享給大家供大家參考。具體分析如下:

很多人都想做瀑布流的效果,這裡告訴大家官網使用的方法,首先要下載瀑布流的外掛程式jquery.masonry.min.js 地址:http://masonry.desandro.com/index.html裡麵包含的很多樣本.

流程:

1. 頁面初始化時,調用外掛程式進行一次排版;

2. 當使用者將捲軸拖到底部時,用ajax載入一次資料,並排版顯示

3. 重複2,直到無資料

Html代碼:

代碼如下:





Insert title here













瀑布流下來了






載入中,請稍後...



我是頁尾



Action代碼:

代碼如下:

//初始化的資料
public function lists(){
$data = D('Info')->order('id DESC')->limit(10)->select();
$this->assign('data', $data);
$this->display();
}
//擷取一次請求的資料
public function getMore(){
//擷取最後一個id
if(!emptyempty($_GET['lastid']))$map['id'] = array('lt', $_GET['lastid']);
$data = D('Info')->where($map)->order('id DESC')->limit(10)->select();
$this->ajaxReturn($data);
}

注意:通過判斷視窗是否滾動到頁面底部來決定用ajax載入一次資料,如果不做處理,會一下子請求很多次,所以,要使用條件來限制.

這裡使用的是往一個元素上賦值 $("#loading").data("on", true);,在請求期間判斷是true則不繼續請求,然後在頁面請求完成後再賦值為false.

希望本文所述對大家的ThinkPHP架構程式設計有所協助。

  • 相關文章

    聯繫我們

    該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

    如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.