This article talks about infinite scroll in JavaScript. this JS reads the data from Google reader in a infinite mode to load the content on demand. this ll improve performance of the page load.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
$(document).ready(function () {
if ($('#cnt').val() == '') {
KattuValithalam('');
}
function BuildPage(contiz) {
var milliseconds = new Date().getTime();
var contiz = $('#cnt').val();
var data = '{"qurl":"' + getQuerystring("q", "") + '","contiz":"' + contiz + '"}';
$.ajax({
type: "POST",
url: "SeithiValiThokkupu.asmx/GetNews",
data: data,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
if (msg.d.length > 0) {
var model = JSON.parse(msg.d);
BuildTable(model, $('#cnt').val());
$('#cnt').val(model.continuation);
}
},
error: function (msg) {
//alert('failed:' + msg.status + ':' + msg.responseText);
$('#Papermain').html('failed:' + msg.status + ':' + msg.responseText);
}
});
}
function BuildTable(msg, code) {
var table = '';
if (code == '') {
//$("#header").append('<div class="feedlytitlebar"><h1>' + msg.title + '</h1>');
$("#Paperheader").append(msg.title + "<br>");
}
for (var post in msg.items) {
var row = '<div class="entrybody">';
row += '<div class="title unread"><a class="titlex read" target="_blanl" href="' + msg.items[post].alternate[0].href + '">' + msg.items[post].title + '</a></div>';
row += '<div class="pagesectiondelimiter">' + msg.items[post].publishedDate + '</div>';
if (msg.items[post].summary != null) {
row += '<div class="summary">' + msg.items[post].summary.content + '</div>';
}
else if (msg.items[post].content != null) {
row += '<div class="summary">' + msg.items[post].content.content + '</div>';
}
row += '</div><br>';
$("#Papermain").append(row);
}
//$('#Container').html(table);
}
function ApplyTemplate(msg) {
// This method loads the HTML template and
// prepares the container div to accept data.
$('#Container').setTemplateURL('RSS.htm', { filter_data: false });
// This method applies the JSON array to the
// container's template and renders it.
$('#Container').processTemplate(msg);
}
function BindNewData() {
var lastProductId = $("#GridView1 tr:last").children("td:first").html();
//get last table row in order to append the new products
var lastRow = $("#GridView1 tr:last");
//Fetch records only when the no. of records displayed in the grid are less than limit.
if (GetRowsCount() < maxRecordsToDisplay) {
if (parseInt(lastProductId, 10) > parseInt(previousProductId, 10)) {
previousProductId = lastProductId;
$.post("FetchRecordsHandler.ashx?lastProductId=" + lastProductId, function (data) {
if (data != null) {
//append new products rows to last row in the gridview.
lastRow.after(data);
}
});
}
}
else {
//Set value of last product id in hidden field so that we can access it from code behind.
$("#hiddenLastProductID").val(lastProductId);
//Check If there is more records in the database
if (parseInt(lastProductId, 10) > parseInt(previousProductId, 10))
$("#btnGetMoreRecords").show();
}
}
function getQuerystring(key, default_) {
if (default_ == null) default_ = "";
key = key.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
var regex = new RegExp("[\\?&]" + key + "=([^]*)");
var qs = regex.exec(window.location.href);
if (qs == null)
return default_;
else
return qs[1];
}
</script>
</head>
<body>
</body>
</html>
047f7b97-5429-420a-84f1-72d32eb96fa4|1|4.0|27604f05-86ad-47ef-9e05-950bb762570c