Infinite Ajax Scroll (IAS)

前端之家收集整理的这篇文章主要介绍了Infinite Ajax Scroll (IAS)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

InfiniteAjaxScroll(IAS)

Author:adamdereszhttp://forum.phpwcms.org/viewtopic.php?f=1&t=24285

Soo,tried it on PHPwcms 1.5.4.1 (r491),and it worked (in general) straight from the Box. Code used wasScroll(IAS) fromhttps://github.com/webcreate/infinite-ajax-scroll

Here's how it went:

Follow these simple steps an you'll get it!

Step 2

tep 1 tep 2

Site is using paginate code as in config/PHPwcms/conf.template_default.inc.PHP file with added extra class for “next page' link as it's required by the IAS script to work

Line 122:
$template_default['article_paginate_navi']   = '<div class="paginate paginate-{POS}">{PREV:&laquo;} <span class="page-next">{NEXT:&raquo;}</span> page # of ##</div>'; //

Step 2

I have the 'articles' template set,that is different to all others within the site for varIoUs reasons,and it includes jQuery (v1.7),the IAS script and then call to start IAS. Theres' some small css provided with IAS I just placed together with my main css file. It's just to position the loading progress graphic,mainly and make nice notes (IAS script can add notes like 'no more to view' or 'hover here for more content') - I don't use that here. The call for that lot is also straight from the Box:

<script type="text/javascript">
jQuery.ias({
    container : '#cnt',
    item: '.artlistentry',
    pagination: '#cnt .paginate',
    next: '.page-next a',
    loader: '<img src="/img/loader.gif"/>'
});
</script>

Above call (if in-page) shall be placed after the posts area so it hides the original pagination block,if it's before - the block will be visible until first ias function trigger.

Step 3

Set up the article nodes of my site to use pagination and show 5 elements per page… And it works like a gem :)

I'm quite sure it will work as good if used for article content pagination… so one can do a fancy self expanding article with just few clicks,literally.

addendum

In administration,for sections that have many articles (news,events,blog name it any way you want) one must enable pagination and set it to required number of elements per page.

I believe it could be implemented for ContentParts pagination - when it's set with the nextpage/prevpage options. It's just so it has 'findable' next button - with special class or ID,so we can tell the IAS script what to look for. As regards howto - it's just to figure out where it's the best to include necessaryJS. In my opinion it would be the 'paginate version' of standard article template… I would not mess with other places for sake of general code 'purity'.

addendum 2

Yes,it's working with content part pagination as well in (almost) the same manner.

原文链接:https://www.f2er.com/ajax/164831.html

猜你在找的Ajax相关文章