Animated Scrolling Functionality for Angular In Pure Typescript

ngx-page-scroll is an angular scroll function written in solid typeface without any additional dependencies.

angularanimations, angular scroll animation, animate on scroll angular, ng2 animate on scroll, angular animate scroll to element, angular animation scroll to top

Features

  • Flexible: Run scrolling animations after component loading, server response, etc.
  • User-friendly directive: scroll to an element referenced in the href attribute (href=”#mytarget) just by adding the pageScroll directive.
  • Customizable: set duration, offset, or whether scrolling stops if the user interrupts (read more).
  • Use custom mitigation functions to calculate scroll position over time.
  • Works across paths (scroll to target element once routing ends) and in both directions (horizontal/vertical).

How to make use of it:

First, you need to install the npm core module:

npm install ngx-page-scroll-core --save

Then add a NgxPageScrollModule to your app module’s import collection:

import { NgxPageScrollCoreModule } from 'ngx-page-scroll-core';

@NgModule({
    imports: [
        /* Other imports here */
        NgxPageScrollCoreModule
        ]
})
export class AppModule {
}

animated scrolling for angular library, ngx-page-scroll Plugin/Github, ng2 animate on scroll example, angular card animation


See Demo And Download

Official Website(Nolanus): Click Here

This superior jQuery/javascript plugin is developed by Nolanus. For extra advanced usage, please go to the official website.

Related Posts

Bootstrap-Steps

A Simple Bootstrap 4 Steps Plugin | Bootstrap Steps

Bootstrap Steps plugin is simple and supports mobile clients. The CSS extension for Bootstrap 4 allows you to create a responsive, SEO-friendly step bar to showcase the…

Vertical-3-Dot-Context-Menu

Simple and Lightweight Vertical 3-Dot Context Menu

The 3-dot Context Menu allows for a simple and lightweight implementation to show 3 vertical dots allowing the user to click and show a menu. Below is…

Sticky-Element-Plugin

Highly Customizable Sticky Element Plugin With JavaScript | HC-Sticky

Sticky JS Library is a JavaScript library that makes any element on your page visible while scrolling. Dependency is free, but it also works as a jQuery…

web-x-spreadsheet

A Web-Based Spreadsheet In Pure JavaScript | x-spreadsheet

JavaScript Spreadsheet Library – x-spreadsheet is a pure JS library used to create an Excel-style spreadsheet and Google Sheets for the web. Features Undo & Redo Paint…

Horizontal-Timeline

Create a Horizontal Timeline Using jQuery plugin | timeline.js

jQuery Timeline, you can easily create two types of horizontal timelines with this plugin. Timeline.js helps you display horizontal timelines, browser, responsive bar, and point/line style from…

Bootstrap-5-Support-for-Internet-Explorer-11

Bootstrap 5 Support for Internet Explorer 11 | BS5 IE

Bootstrap 5 drops support for Internet Explorer 11, but you can add support again simply by adding a CSS file and a few multiple JavaScript packages. What…