https://github.com/binocarlos/pagearrows

navigation arrows for a book
https://github.com/binocarlos/pagearrows

Last synced: 11 days ago
JSON representation

navigation arrows for a book

• Host: GitHub
• URL: https://github.com/binocarlos/pagearrows
• Owner: binocarlos
• Created: 2014-07-09T12:32:53.000Z (over 10 years ago)
• Default Branch: master
• Last Pushed: 2014-09-25T10:38:54.000Z (about 10 years ago)
• Last Synced: 2024-04-14T14:36:44.818Z (7 months ago)
• Language: JavaScript
• Size: 172 KB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
pagearrows

==========

navigation arrows for a book

## installation

```

$ component install binocarlos/pagearrows

```

## example

```js

var PageArrows = require('pagearrows')

var arrows = PageArrows()

arrows.appendTo(document.querySelector('#book'))

// set the current page and the total pages to show/hide arrows

// set page 4 of 10

arrows.setPage(4, 10)

// hide/show arrows when the book changes

book.on('view:index', arrows.setPage.bind(arrows))

// change the HTML of an arrow element when its rendered

arrows.on('render', function(elem, side){

	elem.innerHTML = side + ' arrow'

})

// turn the book when the arrows are clicked

arrows.on('click', function(side, direction){

	book.turnDirection(direction)

})

```

## api

#### `var arrows = PageArrows()`

Create a new set of page arrows

#### `arrows.setPage(index, totalPages)`

Assign the number of pages for the navbar - pages can be an array or a number

#### `arrows.appendTo(elem)`

Append the 2 arrow controls to the given parent element

## events

#### `arrows.on('render', function(elem, side){})`

An arrow element has been created - side is 'left' or 'right'

#### `arrows.on('click', function(side, direction){})`

An arrow has been clicked - side is 'left' or 'right' - direction is -1 or 1

## css

The DOM structure for the arrows - the two arrows are appended to the element passed to appentTo

```html





```


## licence

MIT