/ng-ticker

angular ticker/marquee library

Primary LanguageTypeScriptMIT LicenseMIT

NG-Ticker

All Contributors

Node.js CI npm GitHub stars

html marquee implementation as angular component library.

Installation npm

$ npm install ng-ticker

Usage

Import the module

import { NgTickerModule } from 'ng-ticker';

@NgModule({
    imports: [ NgTickerModule ],
    ...
})
export class AppModule {}

Template

<ng-ticker></ng-ticker>

Options

Name Type Default Description
[direction] optional string 'left' Animation direction of content inside ng-ticker element
[speed] optional string '10s' Speed of animation in direction in seconds. (speed need to be changed as width or content length on screen for better view)
[steps] optional string '' Steps in animation transition to make vintage effect.
[stopOnHover] optional Boolean false Stop ticker on hover
[playState] optional Boolean true Defines play state of ticker content

Styling guide

There are several classes that help you to create your custom styles app.component.css

:host ::ng-deep .ticker-container > span {
    // css properties.
}

Contributors ✨

Thanks goes to these wonderful people (emoji key):


dheeraj237

🚇 ⚠️ 💻

This project follows the all-contributors specification. Contributions of any kind welcome!