View on GitHub
Heap-infinite-scroll

Download this project as a .zip file Download this project as a tar.gz file
Scrolling data in html format

News
Blogs
          jQuery(function() {

              var search1 = new HeapGoogleSearch(HeapGoogleSearch.NEWS),
                  search2 = new HeapGoogleSearch(HeapGoogleSearch.BLOGS),
                  btnClick = function() {
                      search1.setQuery($('#search-word').val());
                      search2.setQuery($('#search-word').val());

                      scroll1.load();
                      scroll2.load();
                  },
                  scroll1 = new HeapInfiniteScroll('.news-panel', {
                      margin: 20,
                      height: 120,
                      frameWidth: 5,
                      downloadIcon: '<i class="fa fa-refresh fa-spin"></i>',
                      url: search1,
                      oncallback: function(itm) {
                          return {
                              isHtml: true,
                              width: (itm['image'] && itm['image']['url'] ?
                                  250 : 150) * itm.content.length/200,
                              description: itm.content ,
                              html: '<span style="color:#bd7e49;">' + itm.title +
                                  '</span><br>' +
                                  (itm['image'] && itm['image']['url'] ?
                                  ('<img src="' + itm['image']['url'] +
                                  '" style="width:120px;float:left;" />') : '') +
                                  itm.content
                          };
                      },
                      onclick: function(itm) {
                          window.open(itm.unescapedUrl, '_blank');
                      }
                  }),
                  scroll2 = new HeapInfiniteScroll('.news2-panel', {
                      margin: 20,
                      height: 80,
                      frameWidth: 5,
                      downloadIcon: '<i class="fa fa-refresh fa-spin"></i>',
                      url: search2,
                      oncallback: function(itm) {
                          return {
                              isHtml: true,
                              description: itm.content ,
                              html: 'author: <span style="color:#0b8bb7;">' +
                                  itm.author +
                                  '</span><br><span style="color:#bd7e49;">' +
                                  itm.title + '</span><br>' + itm.content
                          };
                      },
                      onclick: function(itm) {
                          window.open(itm.blogUrl, '_blank');
                      }
                  });

              $('#search-button').click(btnClick);

              setTimeout(function() {
                  btnClick();
              }, 1000);

          });