https://github.com/cheton/react-facebook-loading

The Facebook loading animation for React.
https://github.com/cheton/react-facebook-loading

Last synced: 18 days ago
JSON representation

The Facebook loading animation for React.

• Host: GitHub
• URL: https://github.com/cheton/react-facebook-loading
• Owner: cheton
• License: mit
• Created: 2016-12-20T14:21:49.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2017-10-06T09:10:12.000Z (about 7 years ago)
• Last Synced: 2024-05-21T17:09:46.761Z (6 months ago)
• Language: JavaScript
• Homepage: https://cheton.github.io/react-facebook-loading
• Size: 729 KB
• Stars: 2
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# react-facebook-loading [![build status](https://travis-ci.org/cheton/react-facebook-loading.svg?branch=master)](https://travis-ci.org/cheton/react-facebook-loading) [![Coverage Status](https://coveralls.io/repos/github/cheton/react-facebook-loading/badge.svg?branch=master)](https://coveralls.io/github/cheton/react-facebook-loading?branch=master)

[![NPM](https://nodei.co/npm/react-facebook-loading.png?downloads=true&stars=true)](https://nodei.co/npm/react-facebook-loading/)

The [Facebook loading animation](https://css-tricks.com/the-facebook-loading-animation-in-css) for React.

Demo: https://cheton.github.io/react-facebook-loading

## Installation

1. Install the latest version of [react](https://github.com/facebook/react) and [react-facebook-loading](https://github.com/cheton/react-facebook-loading):

  ```

  npm install --save react react-facebook-loading

  ```

2. At this point you can import `react-facebook-loading` and its styles in your application as follows:

  ```js

  import FacebookLoading from 'react-facebook-loading';

  // Be sure to include styles at some point, probably during your bootstraping

  import 'react-facebook-loading/dist/react-facebook-loading.css';

  ```

## Usage

```js

```

## API

### Properties

  

    

      Name

      Type

      Default

      Description

    

  

  

    

      delay

      Number|String

      0

      Specify a delay for the start of an animation. The value is defined in seconds (s) or milliseconds (ms). If you specify a number, rather than a regular string, it will use ms as the unit.

    

      duration

      Number|String

      800

      Specify how long an animation takes to complete one cycle. The value is defined in seconds (s) or milliseconds (ms). If you specify a number, rather than a regular string, it will use ms as the unit.

    

    

      zoom

      Number

      1

      Specify the zoom level of the content.

    

  

## License

MIT