Skip to content

Instantly share code, notes, and snippets.

@Brantron
Last active September 6, 2015 11:09
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Brantron/8f3724b7a7226c5455c1 to your computer and use it in GitHub Desktop.
Save Brantron/8f3724b7a7226c5455c1 to your computer and use it in GitHub Desktop.
lazyload
<div class="row">
<div class="columns">
<p>Lazy Load Test</br>Titles and Dates</p>
<div id="cand"></div>
</div>
</div>
var wH = $(window).height();
var pH = $('p').outerHeight();
var limit = Math.ceil(wH/pH) - 3;
var offset = 0;
var counter = 0;
var initLoad = function() {
console.log('http://www.stellarbiotechnologies.com/media/press-releases/json?limit=' + limit + '&offset=' + offset);
$.ajax({
type: 'GET',
url: 'http://www.stellarbiotechnologies.com/media/press-releases/json?limit=' + limit + '&offset=' + offset,
dataType: 'json',
success: function(data) {
var news = data.news;
for(var i = 0; i < news.length; i++) {
counter +=1;
console.log(counter);
$('#cand').append('<p>'+news[i].title+'<br>' + news[i].published.slice(0, - 9) + '</p>');
}
}
});
}
initLoad();
offset = limit;
limit = 3;
$(window).scroll(function() {
if($(window).scrollTop()+ $(window).height() == $(document).height()) {
initLoad();
offset += limit;
}
});
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
@-webkit-keyframes fadein {
0% { opacity: 0; }
100% { opacity: 1; }
}
@-moz-keyframes fadein {
0% { opacity: 0; }
100% { opacity: 1; }
}
@-o-keyframes fadein {
0% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes fadein {
0% { opacity: 0; }
100% { opacity: 1; }
}
body {
background: #009688;
}
p {
-webkit-animation: fadein 1.5s ;
-moz-animation: fadein 1.5s ;
-o-animation: fadein 1.5s ;
animation: fadein 1.5s ;
font-family: open sans;
color: white;
}
<link href="https://cdn.jsdelivr.net/foundation/5.5.0/css/foundation.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment