Infinite Ajax Scroll (IAS)

Infinite Ajax Scroll (IAS)

Author:adamderesz http://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 wasInfinite Ajax Scroll (IAS) from https://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 necessary JS. 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.


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值