UNPKG

4.67 kBMarkdownView Raw
1# zeynepjs
2> A lightweight multi-level jQuery side menu plugin.
3
4[![Downloads](https://img.shields.io/npm/dm/zeynepjs.svg)](https://npmjs.com/zeynepjs)
5[![install size](https://packagephobia.com/badge?p=zeynepjs)](https://packagephobia.com/result?p=zeynepjs)
6
7`zeynepjs` is a light-weight multi-level jQuery side menu plugin. It's fully customizable and is compatible with modern browsers such as Google Chrome, Mozilla Firefox, Safari, Edge and Internet Explorer.
8
9## Install
10```
11$ npm install zeynepjs --save
12```
13
14## Usage
15
16```js
17var zeynep = $('.zeynep').zeynep({
18 load: function (element, options) {
19 console.log('zeynepjs menu is successfully loaded')
20 }
21})
22
23// opens the menu
24zeynep.open()
25
26// closes the menu
27zeynep.close()
28
29// dynamically event binding
30zeynep.on('closing', function () {
31 console.log('guys, the side menu is closing')
32})
33
34// destroys the menu
35zeynep.destroy()
36```
37
38## Using with Webpack
39Once the library installed in your project, just import it:
40
41```js
42import 'zeynepjs'
43```
44
45## Options
46
47| Option | Type | Default | Description |
48| --- | --- | --- | --- |
49| htmlClass | boolean | true | If `true` zeynepjs will add some classes to `<html/>` element like `zeynep-initialized`, `zeynep-opened` |
50
51## Methods
52
53`zeynepjs` exposes those:
54
55| Option | Type | Parameters | Description |
56| --- | --- | --- | --- |
57| on | function | `event name` and `handler function` | To dynamically event binding |
58| open | function | - | To open the menu |
59| close | function | `disableEvent` (optional) | To close the menu. If `disableEvent` is passed true, no close event will be fired |
60| destroy | function | - | To destroy the zeynepjs instance on initialized element |
61
62## Events
63
64> Events can also be defined in options.
65
66### `loading(element, options)`
67
68Fired when the menu is being loaded. This event cannot be defined dynamically. It needs to be defined in options.
69
70`element` is the element that zeynepjs is being loaded on.
71
72`options` is the initialized zeynepjs instance options.
73
74### `load(element, options)`
75
76Fired when the menu is loaded. This event cannot be defined dynamically. It needs to be defined in options.
77
78`element` is the element that zeynepjs has been loaded on.
79
80`options` is the initialized zeynepjs instance options.
81
82### `opening(element, options, details)`
83
84Fired when the menu or a sub-menu is being opened.
85
86`element` is the zeynepjs instance element.
87
88`options` is the initialized zeynepjs instance options.
89
90`details` contains a flag which indicates the item that is being opened is the menu or a sub-menu and the sub-menu DOM Element ID.
91
92### `opened(element, options, details)`
93
94Fired when the menu or a sub-menu is opened.
95
96`element` is the zeynepjs instance element.
97
98`options` is the initialized zeynepjs instance options.
99
100`details` contains a flag which indicates the opened item is the menu or a sub-menu and the opened sub-menu DOM Element ID.
101
102### `closing(element, options, details)`
103
104Fired when the menu or a sub-menu is being closed.
105
106`element` is the zeynepjs instance element.
107
108`options` is the initialized zeynepjs instance options.
109
110`details` contains a flag which indicates the item that is being closing is the menu or a sub-menu and the sub-menu DOM Element ID.
111
112### `closed(element, options, details)`
113
114Fired when the menu or a sub-menu is closed.
115
116`element` is the zeynepjs instance element.
117
118`options` is the initialized zeynepjs instance options.
119
120`details` contains a flag which indicates the closed item is the menu or a sub-menu and the closed sub-menu DOM Element ID.
121
122### `destroying(element, options)`
123
124Fired when the menu is being destroyed.
125
126`element` is the zeynepjs instance element.
127
128`options` is the zeynepjs instance options that is being destroyed.
129
130### `destroyed(element, options)`
131
132Fired when the menu is destroyed.
133
134`element` is the destroyed zeynepjs instance element.
135
136`options` is the destroyed zeynepjs instance options.