Biblioteca JavaScript para voltear elementos DOM-Flippant. js
| Autor: | mintchaos |
|---|---|
| Views Total: | 1,518 |
| Sitio oficial: | Ir a la web |
| Actualizado: | May 13, 2015 |
| Licencia: | MIT |
Vista prévia
Descripción
Flippant. js es una pequeña y personalizable JavaScript & biblioteca CSS3 destinada a voltear elementos DOM sin ninguna dependencia.
Funcionamiento
Incluya el Flippant. CSS y el Flippant. js requeridos en su documento.
<link rel="stylesheet" href="flippant.css"> <script src="flippant.js"></script>
Uso básico:
var front = document.getElementById('flipthis'),
// Generate or pull any HTML you want for the back.
back_content = "<h1>I'm the back!</h1>",
back
// when the correct action happens, call flip!
// flip(element_to_flip, content_for_back, type(modal/card), classname_for_back) -> back_element
// e.g. back = flippant.flip(front, back_content, 'modal', 'my-modal-classname')
// back = flippant.flip(front, back_content, 'modal')
back = flippant.flip(front, back_content)
// this creates the back element, sizes it and flips it around.
// call the close method on the back element when it's time to close.
back.close()
// alternatively you can trigger a close event on the back element if you fancy.
var close_event = new CustomEvent('close')
back.dispatchEvent(close_event)
