@onoffcanvas/jquery

onoffcanvas jQuery package

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@onoffcanvas/jquery
600.1.0-alpha.16 years ago6 years agoMinified + gzip package size for @onoffcanvas/jquery in KB

Readme

@onoffcanvas/jquery NPM version NPM monthly downloads NPM total downloads
onoffcanvas jQuery package

Please consider following this project's author, onokumus, and consider starring the project to show your :heart: and support.

Getting started

Install

Install with npm:
$ npm install --save @onoffcanvas/jquery

Install with yarn:
$ yarn add @onoffcanvas/jquery

Usage

commonjs
const OnoffCanvas = require('@onoffcanvas/jquery');
const oc = new OnoffCanvas(element, options);

es2015 module or typescript
import OnoffCanvas from '@onoffcanvas/jquery';
const oc = new OnoffCanvas(element, options);

browser

  1. Include onoffcanvas StyleSheet

```html ```
  1. Include onoffcanvas plugin's code
```html ```
  1. Add class onoffcanvas and id attribute to div tag.
```html
```
  1. Add trigger button: Be sure to add data-toggle="onoffcanvas".
```html SIDE MENU ```

Canvas Options

  1. Position Options : onoffcanvas is in absolute position by default
- add class is-fixed to fixed position
```html
```
  1. Direction Options : onoffcanvas is in full-screen by default
- is-top - is-right - is-bottom, - is-left - is-center
```html
```
  1. Opened/Closed Options : onoffcanvas is closed by default
- add class is-open to open.
```html
```
  1. Hoverable Options :
- add class onoffcanvas-container to parent element - add class is-hoverable to onoffcanvas
```html
<div class="onoffcanvas is-hoverable" id="side-canvas"></div>
```

Trigger Options

  • Type
1. link with href
```html toggle onoffcanvas ```
2. button with data-target
```html toggle onoffcanvas ```
  • Style
> if you want to use the default style for onoffcanvas, add class onoffcanvas-toggler
```html ```
OR
```html ```

Author

onokumus

License

Copyright © 2018, onokumus. Released under the MIT License.

This file was generated by verb-generate-readme
, v0.8.0, on September 19, 2018.