https://github.com/maggialejandro/bakan

Javascript Marquee / Ticker implementation
https://github.com/maggialejandro/bakan

Last synced: 5 days ago
JSON representation

Javascript Marquee / Ticker implementation

• Host: GitHub
• URL: https://github.com/maggialejandro/bakan
• Owner: maggialejandro
• Created: 2016-06-28T19:37:27.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2017-01-09T13:07:52.000Z (almost 8 years ago)
• Last Synced: 2024-12-17T13:04:03.949Z (9 days ago)
• Language: JavaScript
• Size: 10.7 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Bakan

[Demo](http://bakan.96.lt/)

## Installation

`npm install --save bakan`

## Usage

``` js

  import Bakan from 'bakan'

  var $dom = document.getElementById('root')

  var options = {

    text: 'Lorem ipsum dolor sit amet',

    step: 1,

    period: 10,

    space: 1,

    color: 'white',

    font: 'arial',

    background: '#FFAA00',

    opacity: 50

  }

  new Bakan($dom, options)

```

## Options

### text

**Type:** _String_ or _Array_

``` js

text: ['Lorem ipsum dolor sit amet', 'Quasi quis, facilis culpa omnis']

```

Text shown by Bakan marquee

### step

**Type:** _Integer_

``` js

step: 1

```

Number of pixels moved each period

### period

**Type:** _Integer_

``` js

period: 10

```

Time between each animation (Miliseconds)

### space

**Type:** _Integer_

``` js

space: 10

```

Number of characters between each text secuence

### color

**Type:** _Hexa_ or _String_

``` js

color: 'blue'

```

Font color

### font

**Type:** _String_

``` js

font: 'times new roman'

```

Font family

### background

**Type:** _Hexa_

``` js

background: '#FF0000'

```

Background color

### opacity

**Type:** _Integer_ 

**Values:** `[ 0, 100 ]`

``` js

opacity: '100'

```

Background opacity