Update README.md
This commit is contained in:
parent
21f73ea37f
commit
2952077c87
57
README.md
57
README.md
@ -1,6 +1,6 @@
|
|||||||
# FFNM (Front-End for the next master)
|
# FFNM (Front-End for the next master)
|
||||||
|
|
||||||
Simple plugin to avoid writing Javascript in trivial tasks.
|
Simple utility to avoid writing Javascript when working with classes.
|
||||||
|
|
||||||
## Documentation
|
## Documentation
|
||||||
|
|
||||||
@ -9,6 +9,60 @@ Simple plugin to avoid writing Javascript in trivial tasks.
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## English
|
||||||
|
|
||||||
|
### Install
|
||||||
|
|
||||||
|
Add to your `<head>` the following tag.
|
||||||
|
|
||||||
|
```html
|
||||||
|
<script src="https://cdn.jsdelivr.net/gh/tanrax/FFNM@v1.0.0/ffnm.min.js"></script>
|
||||||
|
```
|
||||||
|
|
||||||
|
### Examples
|
||||||
|
|
||||||
|
#### Click
|
||||||
|
|
||||||
|
##### Add the class `show` to the `#nav` selector when the button is pressed.
|
||||||
|
|
||||||
|
```html
|
||||||
|
<button i-click="class:add('show', '#nav')">open</button>
|
||||||
|
```
|
||||||
|
|
||||||
|
##### Remove the `show` class from the `#nav` selector when the button is pressed.
|
||||||
|
|
||||||
|
```html
|
||||||
|
<button i-click="class:remove('show', '#nav')">close</button>
|
||||||
|
```
|
||||||
|
|
||||||
|
##### Switch the `show` class to the `#nav` selector when the button is pressed.
|
||||||
|
|
||||||
|
```html
|
||||||
|
<button i-click="class:toggle('show', '#nav')">view</button>
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Classes without events
|
||||||
|
|
||||||
|
##### Add the class `show` to the `#nav` selector
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
class:add('show', '#nav')
|
||||||
|
```
|
||||||
|
|
||||||
|
##### Remove the `show` class from the `#nav` selector
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
class:remove('show', '#nav')
|
||||||
|
```
|
||||||
|
|
||||||
|
##### Switch the class `show` to the `#nav` selector
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
class:toggle('show', '#nav')
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## Spanish/Español
|
## Spanish/Español
|
||||||
|
|
||||||
### Instalar
|
### Instalar
|
||||||
@ -60,6 +114,7 @@ class:remove('show', '#menu')
|
|||||||
```javascript
|
```javascript
|
||||||
class:toggle('show', '#menu')
|
class:toggle('show', '#menu')
|
||||||
```
|
```
|
||||||
|
---
|
||||||
|
|
||||||
## Development
|
## Development
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user