Paginated auto-updating news feed

This example shows how to use @Paginator@’s array-like unshift method to create a paginated news feed where new items appear at the top of the list, fading in and pushing other content down. To achieve this, we make an HTTP request for the new content and wrap it an a <div class="item">. We slide the paginator down temporarily to make room for the new item, then unshift the item into the paginator and snap the scroll offset back to where it should be.

Brown backs down in expenses row

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui. Donec consequat cursus nisl. Pellentesque at dolor vitae urna feugiat ornare. Nam gravida. Nam congue felis nec massa. In ac mi. Donec dolor neque, consectetur et, imperdiet at, convallis id, pede.

Israel to probe phosphorus claims

Morbi lectus augue, tristique in, iaculis sit amet, aliquet quis, lectus. Nam id dui. Aenean in lacus eget magna scelerisque viverra. Donec varius commodo est. Sed vitae augue. Maecenas dapibus nulla eu dui sodales tincidunt. Aliquam tincidunt eleifend arcu.

Animal rights campaigners jailed

Morbi at tellus. Suspendisse potenti. Nullam auctor tempor turpis. Nunc vel nisi. Ut rutrum massa vel quam auctor cursus. Quisque faucibus, sapien in condimentum convallis, neque dui malesuada mauris, eget aliquet felis tellus mollis velit.

Channel 4 ‘must form partnership’

Proin ornare urna non mauris. Mauris eget elit eu neque sollicitudin pulvinar. Sed elit pede, convallis vel, mollis ac, gravida vitae, erat. Fusce elit. Praesent id leo. Nunc in nisl non pede venenatis pharetra. Integer tristique suscipit lorem. Praesent nec tortor.

Ex-KGB spy buys UK paper for £1

Phasellus dapibus purus id diam. Fusce blandit aliquam purus. Pellentesque ut magna. Donec posuere. Etiam hendrerit luctus arcu. Praesent interdum. Maecenas augue mauris, mattis non, condimentum nec, commodo sed, mauris. Integer at magna ut neque luctus blandit.

Report rejects Omagh bomb claims

Nam pellentesque mauris id metus. Phasellus mi eros, tincidunt non, imperdiet at, iaculis eu, mi. Donec sodales orci et ipsum. Quisque metus. Donec erat. Aliquam mattis mollis tellus. Donec tristique diam at nunc. In eget urna. Vivamus accumsan nibh ac neque.

JavaScript source code

Stylesheet