https://github.com/dsabre/countdown

A fully customizable countdown javascript for your site.
https://github.com/dsabre/countdown

countdown javascript-countdown js-countdown

Last synced: about 1 month ago
JSON representation

A fully customizable countdown javascript for your site.

• Host: GitHub
• URL: https://github.com/dsabre/countdown
• Owner: dsabre
• License: mit
• Created: 2021-11-10T13:37:12.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2021-11-12T09:56:14.000Z (about 3 years ago)
• Last Synced: 2024-11-01T20:29:01.319Z (about 2 months ago)
• Topics: countdown, javascript-countdown, js-countdown
• Language: JavaScript
• Homepage: https://codepen.io/daniele-sabre/pen/XWaYQew
• Size: 26.4 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        

# Countdown

A fully customizable countdown javascript for your site.

[![Version](https://img.shields.io/npm/v/@dsabre/countdown?style=for-the-badge)](https://www.npmjs.com/package/@dsabre/countdown)

[![License: MIT](https://img.shields.io/npm/l/@dsabre/countdown?registry_uri=https%3A%2F%2Fregistry.npmjs.org&style=for-the-badge)](https://github.com/dsabre/countdown/blob/main/LICENSE)

[![Downloads](https://img.shields.io/npm/dw/@dsabre/countdown?style=for-the-badge)](https://www.npmjs.com/package/@dsabre/countdown)

[![GitHub issues](https://img.shields.io/github/issues-raw/dsabre/countdown?style=for-the-badge)](https://github.com/dsabre/countdown/issues)

[![Dependencies](https://img.shields.io/librariesio/release/npm/@dsabre/countdown?style=for-the-badge)](https://www.npmjs.com/package/@dsabre/countdown)

## Usage/Examples

### Initialization

```javascript

import Countdown from '@dsabre/countdown';

(function() {

    new Countdown();

})();

```

### Usage

Declare an html element with `data-dscountdown` attribute, the value must be in the format: **m/d/Y H:i:s**

```html



```


### Other attributes

Labels

```

data-labels='{"days":"days","hours":"hours","minutes":"minutes","seconds":"seconds"}'

```

Prefix

```

data-prefix="Timer! "

```

Suffix

```

data-suffix=" to ending!"

```

Change separator (default `":"`)

```

data-separator="."

```

Custom container classes

```

data-countdownclasses="exampleClass1 exampleClass2 ... exampleClassN"

```

Custom values classes

```

data-valuesclasses="exampleClass1 exampleClass2 ... exampleClassN"

```

Custom labels classes

```

data-labelclasses="exampleClass1 exampleClass2 ... exampleClassN"

```

Custom separator classes

```

data-separatorclasses="exampleClass1 exampleClass2 ... exampleClassN"

```

### Full example

```html



```


## Demo

https://codepen.io/daniele-sabre/pen/XWaYQew

## Contributing

For contributions, issues and feature requests please check [issues page](https://github.com/dsabre/countdown/issues).

## Authors

- [Daniele Sabre](https://github.com/dsabre)

## Support me



  



## License

[MIT](https://choosealicense.com/licenses/mit/)