tru3n0 >>> blog / 73 posts / categories / 68 comments / feed / comments feed

Hovertip: Tooltips en Drupal

Un tooltip es ese texto de ayuda que aparece al poner el ratón encima de algún elemento de una página web, aunque los usos pueden ser diversos.

En drupal hay varios módulos que permiten utilizar tooltips, uno de ellos es Hovertips and Clicktips.

Se instala cómo cualquier otro módulo, descargamos y descomprimimos el fichero en la carpeta modules dónde tengamos instalado drupal.

Una vez instalado tenemos que activar el módulo en el panel de administración.

Para hacer una prueba de cómo quedaría un tooltip podemos crear una página nueva y escribir el siguiente código html. Es necesario cambiar el formato de entrada a full html.

<span hovertip=”termdefinition”>Termino</span>
<div id=”termdefinition” class=”hovertip”><h1>Titulo</h1><p>El texto que queramos</p></div>

La plantilla que trae por defecto no es muy atractiva, es recomendable modificarla un poco, se encuentra en la carpeta del módulo y se llama hovertip.css

Otra cosa que no me gusta mucho esque por defecto trae un delay de 700ms, esto se puede cambiar editando el fichero hovertip.js y modificando la siguiente sección:

var hovertipConfig = {'attribute':'hovertip','showDelay': 300,'hideDelay': 700}

No comments

Leave a comment