@silicic/scroll-gallery-ng NPM

@silicic/scroll-gallery-ng

A scroll-able gallery component.

npm.io

Installation

Install with npm:

npm install @silicic/scroll-gallery-ng

Usage

Import ScrollGalleryModule:

@NgModule({
  imports: [ScrollGalleryModule]
})
export class AppModule {}

And wrap si-gallery-item with si-scroll-gallery like this:

<si-scroll-gallery
  [activatedItemPosition]="'center'"
  [bounceRate]="400"
  [gap]="120"
  [scaleRate]="1.1"
>
  <si-gallery-item>
    A
  </si-gallery-item>
  <si-gallery-item>
    B
  </si-gallery-item>
  <si-gallery-item>
    C
  </si-gallery-item>
</si-scroll-gallery>

API

si-scroll-gallery

Property	Description	Type	Default Value
`[gap]`	Gap between two si-gallery-item	`number`	120
`[scaleRate]`	Scale ratio of activated si-gallery-item	`number`	1.2
`[activatedItemPosition]`	Left offset of the activated item to the left border	`number \| 'center'`	1.2
`[bounceRate]`	Bouncing flexibility of the component when it's scrolled to the first or last	`number`	100
`(activatedChanged)`	The currently activated item changed.	`Subject<void>`	-
`(draggingStarted)`		`Subject<void>`	-
`(dragging)`		`Subject<PointerVector>`	-
`(draggingEnd)`		`Subject<PointerVector>`	-

License

MIT

tslib

@infinitebrahmanuniverse/nolb-_sil @everything-registry/sub-chunk-835

0.0.1

5 years ago