Thursday, November 16, 2017

Angular Scroll-to-top component

I've recently created a small component providing a scroll-to-top functionality for any Angular 4 app. You can add it to your project and style it according to your needs.
The component provides 2 API attributes:

scrollOffset:

The amount of page scroll offset (from the top) in pixels after witch the component is shown. Default value is 0.

scrollDuration:

The scroll animation duration (ms). Default value is 500.


Code is available on Github.

Demo:


Saturday, October 7, 2017

PrimeNG Datatable Sticky Header

A directive providing sticky mode for PrimeNG data table.

I've recently got a request to have a PrimeNG datatable scrolled with the page but have the data table header stick to the top of the page while scrolling. As this feature is not available out of the box with the PrimeNG data table component, I've written a dedicated directive for it.

The directive sets the PrimeNG data table header to sticky mode when scrolling the page. This prevents the header from scrolling with the table thus keeping the user in context and allows data sorting even when scrolled.

Code is available on Github.

Demo:

About Me

My photo
I've been developing Internet and rich-media application for 15 years. In my work I emphasis usability and best user experience as well as sleek design. My main expertise are JavaScript, Flex and Flash.

Followers