
Security News
MCP Community Begins Work on Official MCP Metaregistry
The MCP community is launching an official registry to standardize AI tool discovery and let agents dynamically find and install MCP servers.
ngx-shimmer-loading
Advanced tools
Facebook shimmer loading effect for Angular 8+ apps. It's a fancy way to tell your users that there's something loading. ngx-shimmer-loading is simple and easy to use. It also comes with the two directions.
Facebook shimmer loading effect for Angular 8+ apps. It's a fancy way to tell your users that there's something loading.
ngx-shimmer-loading is simple and easy to use. It also comes with the two directions
See Demo page.
ngx-shimmer-loading
:npm i --save ngx-shimmer-loading
NgxShimmerLoadingModule
into your module:import { NgxShimmerLoadingModule } from 'ngx-shimmer-loading';
@NgModule({
...
imports: [ NgxShimmerLoadingModule ],
...
})
export class AppModule {}
ngx-shimmer-loading
component:<ngx-shimmer-loading></ngx-shimmer-loading>
You can customize it with different inputs - check API for more details.
Example:
<ngx-shimmer-loading [shape]="'square'" [width]="'70px'"></ngx-shimmer-loading>
Input | Type | Default | Required | Description |
---|---|---|---|---|
shape | 'circle' OR 'square' OR 'rect' | rect | no | Set shimmer shape. |
width | string | '80%' | no | Set shimmer width. In case of shape is 'circle' or 'square' use width with px unit. |
height | string | '12px' | no | Set shimmer height. In case of shape is 'circle' or 'square' shimmer height will equal shimmer width. |
borderRadius | string | '5px' | no | Set shimmer border radius. In case of shape is 'circle' borderRadius equals '50%' |
direction | 'ltr' OR 'rtl' | 'ltr' | no | Set shimmer direction. |
If you are not happy with default styles you can easily override them with your styles like that:
.shimmer-loading .ngx-shimmer {
// Your styles go here...
}
Note that: shimmer effect animation here depends on css linear-gradient
property so, if you want to change its color you can edit it or you can unset it and change its background-color
value if you don't want the shimmer effect animation.
Contributions are welcome. You can start by looking at issues with label Help wanted or creating new Issue with proposal or bug report.
FAQs
Facebook shimmer loading effect for Angular 8+ apps. It's a fancy way to tell your users that there's something loading. ngx-shimmer-loading is simple and easy to use. It also comes with the two directions.
The npm package ngx-shimmer-loading receives a total of 581 weekly downloads. As such, ngx-shimmer-loading popularity was classified as not popular.
We found that ngx-shimmer-loading demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
The MCP community is launching an official registry to standardize AI tool discovery and let agents dynamically find and install MCP servers.
Research
Security News
Socket uncovers an npm Trojan stealing crypto wallets and BullX credentials via obfuscated code and Telegram exfiltration.
Research
Security News
Malicious npm packages posing as developer tools target macOS Cursor IDE users, stealing credentials and modifying files to gain persistent backdoor access.