Sep 18, 2014

JS - Infinite scroll sample code.

// START OF INFINITE SCROLLING FUNCTION
var base_url = config.base_url;
var offset = 1;
var request_ajax = true;
var ajax_is_on = false;
var objHeight = $(window).height() - 50;
var last_scroll_top = 0;
    
    
var type = '0';
var csrftoken = $("meta[name='csrf-token']").attr('content');
var csrfname = $("meta[name='csrf-name']").attr('content');
$(window).scroll(function(event) {
  var st = $(this).scrollTop();
  if(st > last_scroll_top){
    if ($(window).scrollTop() + 100 > $(document).height() - $(window).height()) {
      if (request_ajax === true && ajax_is_on === false) {
        ajax_is_on = true; 
        $.ajax({
          url: base_url + 'category_more',
          data:{page_number:offset,id_cat:'459',type:type, parameters:'[]', csrfname : csrftoken},
          type: 'post',
          dataType: 'JSON',
          onLoading:jQuery(".loading").html('<img src="/assets/images/orange_loader.gif" />').show(),
          success: function(d) {
            if(d == "0"){
              ajax_is_on = true;
            }else{ 
              if(d.substring(0,5)  == ""){
                $($.parseHTML(d.trim())).appendTo($('#product_content'));
                ajax_is_on = true;
              }else{
                $($.parseHTML(d.trim())).appendTo($('#product_content'));
                ajax_is_on = false;
                offset += 1;   
              }
            }
            jQuery(".loading").fadeOut();    
          }
        });
      }
    }
  }
  last_scroll_top = st;
});
// END OF INFINITE SCROLLING FUNCTION

No comments: