堆棧內存溢出
  簡體   English   中英

根據div高度加載更多滾動

[英]load more scroll based on div height

 原文  2013-06-07 22:55:33  2   1    javascript/ css

問題描述

加載基於div高度的更多/無限滾動按鈕。 假設我有一個高度為500px的div，且div中的內容等於1000px。 如何在單擊時僅加載div的500px並用按鈕加載div的其余500px？

我希望這很清楚嗎？

1 個解決方案

解決方案1
 0  2013-06-07 23:09:31

我會用javascript和CSS做到這一點

演示http://jsfiddle.net/kevinPHPkevin/tnTPw/2/ 

$('.div').click(function () {
                $(this).addClass('height');

            });

AJAX 在滾動到底部時加載更多<div></div><div id="text_translate"><p>我想使用 AJAX 和 PHP ZC1C425268E68385D14AB5074C17A 從 mysql 加載數據。 例子： </p><p></p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"><div class="snippet-code"><pre class="snippet-code-css lang-css prettyprint-override"> #ajaxload { border: 1px solid #000; max-height: 400px; overflow-y:scroll; }</pre><pre class="snippet-code-html lang-html prettyprint-override"> &lt;?php //data from mysql... ?&gt; &lt;div id="ajaxload"&gt; &lt;ul&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;Loading next data...&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt;</pre></div></div><p></p><p> 但是我在這里（在stackoverflow上）沒有找到具體的例子......一切都只是全頁滾動，但我只想滾動&lt;div&gt;以加載更多數據。 你能幫助我嗎？</p></div>

[英]AJAX load more on scroll to bottom in <div>

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 根據滾動更改 DIV 高度 根據滾動動態調整div高度 滾動到 Div 時 Javascript 加載更多 AJAX 在滾動到底部時加載更多<div></div><div id="text_translate"><p>我想使用 AJAX 和 PHP ZC1C425268E68385D14AB5074C17A 從 mysql 加載數據。 例子： </p><p></p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"><div class="snippet-code"><pre class="snippet-code-css lang-css prettyprint-override"> #ajaxload { border: 1px solid #000; max-height: 400px; overflow-y:scroll; }</pre><pre class="snippet-code-html lang-html prettyprint-override"> &lt;?php //data from mysql... ?&gt; &lt;div id="ajaxload"&gt; &lt;ul&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;data...&lt;/li&gt; &lt;li&gt;Loading next data...&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt;</pre></div></div><p></p><p> 但是我在這里（在stackoverflow上）沒有找到具體的例子......一切都只是全頁滾動，但我只想滾動&lt;div&gt;以加載更多數據。 你能幫助我嗎？</p></div> 如果 Div 的前一個 div 可見且高度更高，則 Div 不會滾動 如何基於父div高度固定內部div的滾動位置 如果 DOM 包含可改變高度的 div，則在滾動上加載更多數據 加載時基於視口高度的動態div高度（Kendo UI） jQuery根據滾動位置增加和減少div高度 如何根據 javascript 中的滾動 position 動態更改 div 的高度？
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM