<script>
jQuery(document).ready(function () {
size_li = jQuery(".inventory article").size();
x=8;
jQuery('.inventory article:lt('+x+')').show();
jQuery('#loadMore').click(function () {
x= (x+4 <= size_li) ? x+4 : size_li;
jQuery('.inventory article:lt('+x+')').show();
jQuery('#showLess').show();
if(x == size_li){
jQuery('#loadMore').hide();
}
});
jQuery('#showLess').click(function () {
x=(x-4<0) ? 8 : x-4;
jQuery('.inventory article').not(':lt('+x+')').hide();
jQuery('#loadMore').show();
jQuery('#showLess').show();
if(x == 8){
jQuery('#showLess').hide();
}
});
});

</script>

<div id="loadMore">Load more</div>
<div id="showLess">Show less</div>

ex. http://jsfiddle.net/cse_tushar/6FzSb/2/

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.