Front-End for the next master
Go to file
Andros Fenollosa f4f1ea6572 Add ramda
2020-06-30 22:26:12 +02:00
dist Add ramda 2020-06-30 22:26:12 +02:00
src Add ramda 2020-06-30 22:26:12 +02:00
.gitignore Add ramda 2020-06-30 22:26:12 +02:00
LICENSE Initial commit 2020-06-29 19:39:58 +02:00
package-lock.json Add ramda 2020-06-30 22:26:12 +02:00
README.md Add Development README 2020-06-30 10:12:43 +02:00
tsconfig.json Add ramda 2020-06-30 22:26:12 +02:00

FFNM (Front-End for the next master)

Simple plugin to avoid writing Javascript in trivial tasks.

Documentation


Spanish/Español

Instalar

Añade a tu <head> la siguiente etiqueta.

<script defer src="https://cdn.jsdelivr.net/gh/tanrax/FFNM@v1.0.0/ffnm.min.js"></script>

Ejemplos de uso

Clic

Añadir la clase show al selector #menu cuando sea pulsado el botón.
<button i-click="class:add('show', '#menu')">abrir</button>
Quitar la clase show al selector #menu cuando sea pulsado el botón.
<button i-click="class:remove('show', '#menu')">cerrar</button>
Intercambiar la clase show al selector #menu cuando sea pulsado el botón.
<button i-click="class:toggle('show', '#menu')">ver</button>

Scroll

Añadir la clase down al nav cuando el usuario haga scroll hacia abajo.
<nav i-scroll-down="class:add('down', this)"></nav>
Quitar la clase down al nav cuando el usuario haga scroll hacia arriba.
<nav i-scroll-up="class:remove('down', this)"></nav>

Hover

Añadir la clase tadam al selector #menu cuando el usuario haga hover sobre el botón.
<button i-hover="class:toggle('tadam', '#menu')">sorpresa!</button>

Clases sin eventos

Añadir la clase show al selector #menu
class:add('show', '#menu')
Quitar la clase show al selector #menu
class:remove('show', '#menu')
Intercambiar la clase show al selector #menu
class:toggle('show', '#menu')

Development

Build

tsc --outFile dist/ffnm.min.js src/core.ts

Watch mode

tsc --watch --outFile dist/ffnm.min.js src/core.ts