jQuery實(shí)現(xiàn)模仿微博下拉滾動條加載數(shù)據(jù)效果
本文實(shí)例講述了jQuery實(shí)現(xiàn)模仿微博下拉滾動條加載數(shù)據(jù)效果。分享給大家供大家參考,具體如下:
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>滾動條距離底部</title> <script src="jquery-1.6.2.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { var i = 4; $(window).bind("scroll", function (event) { //滾動條到網(wǎng)頁頭部的 高度,兼容ie,ff,chrome var top = document.documentElement.scrollTop + document.body.scrollTop; //網(wǎng)頁的高度 var textheight = $(document).height(); // 網(wǎng)頁高度-top-當(dāng)前窗口高度 if (textheight - top - $(window).height() <= 100) { if (i >= 100) { return; //控制最大只能加載到100 } $('#div1').css("height", $(document).height() + 100); i++; //可以根據(jù)實(shí)際情況,獲取動態(tài)數(shù)據(jù)加載 到 div1中 $('<div>' + i + '</div>').appendTo($('#div1')); } }); }) </script> <style> #div1 div{ font-size:100px; background:#ccc;margin-top:5px} </style> </head> <body> <form id="form1" runat="server"> <div style="height: 1000px;" id="div1"> <div> 1</div> <div> 2</div> <div> 3</div> <div> 4</div> </div> </form> </body> </html>
希望本文所述對大家jQuery程序設(shè)計有所幫助。
- asp.net+jquery滾動滾動條加載數(shù)據(jù)的下拉控件
- js/jquery控制頁面動態(tài)加載數(shù)據(jù) 滑動滾動條自動加載事件的方法
- 拉動滾動條加載數(shù)據(jù)的jquery代碼
- asp.net網(wǎng)站開發(fā)中用jquery實(shí)現(xiàn)滾動瀏覽器滾動條加載數(shù)據(jù)(類似于騰訊微博)
- 基于jquery實(shí)現(xiàn)頁面滾動到底自動加載數(shù)據(jù)的功能
- jQuery結(jié)合AJAX之在頁面滾動時從服務(wù)器加載數(shù)據(jù)
- jquery滾動加載數(shù)據(jù)的方法
- jQuery實(shí)現(xiàn)當(dāng)拉動滾動條到底部加載數(shù)據(jù)的方法分析
相關(guān)文章
jquery css實(shí)現(xiàn)郵箱自動補(bǔ)全
這篇文章主要為大家詳細(xì)介紹了jquery css實(shí)現(xiàn)郵箱自動補(bǔ)全功能,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-11-11jQuery實(shí)現(xiàn)的產(chǎn)品自動360度旋轉(zhuǎn)展示特效源碼分享
這篇文章主要展示了jQuery實(shí)現(xiàn)的產(chǎn)品自動360度旋轉(zhuǎn)展示特效,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2015-08-08jQuery Mobile開發(fā)中日期插件Mobiscroll使用說明
這篇文章主要介紹了jQuery Mobile開發(fā)中日期插件Mobiscroll使用說明,需要的朋友可以參考下2016-03-03基于jQuery Ajax實(shí)現(xiàn)上傳文件
這篇文章主要為大家詳細(xì)介紹了jQuery Ajax上傳文件的相關(guān)代碼,需要的朋友可以參考下2016-03-03jQuery使用zTree插件實(shí)現(xiàn)樹形菜單和異步加載
這篇文章主要介紹了jQuery使用zTree插件實(shí)現(xiàn)樹形菜單和異步加載的相關(guān)方法,感興趣的小伙伴們可以參考一下2016-02-02jQuery中調(diào)用WebService方法小結(jié)
以前在寫ajax請求時,總是喜歡使用jQuery+ashx的方式進(jìn)行調(diào)用,今天采取jQuery+WebService的方法來做ajax請求,發(fā)現(xiàn)這種方式比使用ashx的方式要更方便。2011-03-032014年50個程序員最適用的免費(fèi)JQuery插件
這篇文章主要介紹了2014年50個程序員最適用的免費(fèi)JQuery插件,需要的朋友可以參考下2014-12-12