How to lazyload a standard html table that has many rows?

deltrum

New Member
Instead of using a table plugin by someone else, I choose to do it the standard HTML way of making Tables and rows etc etc. I would fetch data from a database to fill the rows. But when the number of rows exceeded 10,000, I realized I needed to lazy_load the rows otherwise the website would be incredibly slow. I've looked for ways to lazy load rows of a table, but I can't seem to find it anywhere, so my question is simply does the lazyloading plug-in or for rows even exist? Hope some guru can answer this. Thanks in advance!\[quote\] Background as to what I'm trying to do: I'm creating the rough sketch of the table in the html code, then during runtime, I will add rows to the table through DOM when the user searches for particular things. When they search it, there will be thousands of results, and I want to lazyload the result into the table.\[/quote\]jQuery provides lazyload for images and containers of images. Some other plug-ins allowed for lazyloading of divs. Lazyloading for table rows however seemed to be non-existant.Some sample code for context:HTML:\[code\] <fieldset> <legend>PhotoViewer v1.6</legend> <h4 id = "albumName"><i>Photos</i></h4> <table cellspacing="1" border="2" id = "photoTable" class = "lazyProgressiveLoad"> <tr style="font-style: italic; font-size: small; font-family: Segoe UI Light; color: Red"> <th>--Photo--</th> <th>--Label--</th> <th>--Path--</th> <th><input type="button" value="http://stackoverflow.com/questions/12573722/Add Photo" onclick="addPhoto()" id = "addPhoto"/></th> </tr> </table> </fieldset>\[/code\]\[quote\] Looking for some code that will allow the same functionality as the code below for table rows.\[/quote\]Javascript:\[code\]$(function() { $("img").lazyload({ effect : "fadeIn" /* ,appear : function(elements_left, settings) { console.log("appear"); console.log(elements_left); //console.log(this, elements_left, settings); }, load : function(elements_left, settings) { console.log("load"); console.log(elements_left); //console.log(this, elements_left, settings); } */ }); });\[/code\]
 
Back
Top