Simple biblioteca de información sobre herramientas animadas con CSS puro-Balloon. CSS
| Autor: | kazzkiq |
|---|---|
| Views Total: | 3,180 |
| Sitio oficial: | Ir a la web |
| Actualizado: | January 29, 2019 |
| Licencia: | MIT |
Vista prévia
Descripción
Una sencilla biblioteca de CSS pura y ligera le ayuda a crear información sobre herramientas animadas para cualquier elemento DOM utilizando los atributos datos de HTML5.
Características
- Admite 4 direcciones: superior, derecha, inferior e izquierda
- Admite cualquier carácter HTML e incluso fuentes de iconos.
Funcionamiento
Descargue y cargue la versión minimizada de Balloon. CSS en la sección Head de su página web.
<link href="balloon.min.css" rel="stylesheet">
Agregue una descripción superior a un elemento dado de la siguiente manera:
- -globo de datos: especifica el contenido que se muestra en la información sobre herramientas.
- Data-Balloon-pos = "up": especifica la dirección de la información sobre herramientas. Aceptar valores: ' arriba ', ' derecha ', ' abajo ' y ' izquierda '.
<div class="box" data-balloon="Top Tooltip" data-balloon-pos="up">
Cambie el tamaño de la información sobre herramientas mediante el atributo de longitud de globo de datos. Aceptar valores: ' pequeño ', ' mediano ', ' grande ', ' Xlarge ' o ' Fit '.
<div class="box" data-balloon="I'm a xlarge tooltip" data-balloon-pos="down" data-balloon-length="xlarge">
Registro de cambios
01/29/2018
- Bugfix
08/13/2018
- Bugfix
