Latest web development tutorials

jQuery UI API - elemento de caja sobre herramientas (información sobre herramientas de widgets)

categoría

Los widgets (widgets)

uso

Descripción: Caja de información sobre herramientas themable personalizable, sustituir el cuadro de información sobre herramientas nativa.

Nueva versión: 1.9

cuadro Etiqueta (información sobre herramientas) sustituyó al cuadro de información sobre herramientas nativo, de modo que puedan tematización, también permite diversas personalizaciones:

  • Mostrar no sólo el título del otro contenido, al igual que las notas al pie o en línea por el Ajax para recuperar el contenido adicional.
  • la orientación personalizada, por ejemplo, se centró en el cuadro de elemento de información sobre herramientas.
  • Añadir estilos adicionales para personalizar el aspecto de una región de advertencia o de error.

Una animación del gradiente por defecto para mostrar y ocultar información sobre herramientas cuadro, en comparación con la simple conmutación de la visibilidad de tal apariencia más espiritual. Esto puede show y hide las opciones de personalización.

items y content opciones necesitan para mantener el ritmo. Si cambia uno, tendrá que cambiar a la otra.

En general, los elementos con discapacidad no activarán los eventos DOM. Por lo tanto, una herramienta adecuada para controlar el elemento de balón deshabilitado no es posible, porque tenemos que escuchar a los eventos para determinar cuándo mostrar y ocultar cuadro de información sobre herramientas. Esto conduce a jQuery UI no puede garantizar el apoyo para el elemento discapacitados pegada a la caja punta de la herramienta en cualquier nivel. Esto significa que si necesita que se le solicite los elementos deshabilitados, puede que tenga que utilizar una mezcla de cuadro de información sobre herramientas de globo nativo y jQuery UI.

tematización

elemento de caja sobre herramientas (información sobre herramientas de widgets) usando framework jQuery UI CSS para definir la apariencia de su estilo. Si es necesario utilizar el cuadro de información sobre herramientas de estilo especificada, puede utilizar el siguiente nombre de clase CSS:

  • ui-tooltip : cuadro de información sobre herramientas recipiente exterior.
    • ui-tooltip-content : La sugerencia contenido de la caja.

confiar

información adicional

  • La parte funcional requiere un poco de CSS, de lo contrario no funcionará. Si crea un tema personalizado, utilice el archivo CSS widget de especificado como un punto de partida.

Ejemplos

Utilizar todos los elementos con el atributo título del gestor de eventos, para crear un cuadro de información sobre herramientas (información sobre herramientas) en el documento. 

<! DOCTYPE html>
<Html lang = "es">
<Head>
  <Charset Meta = "UTF-8">
  <Título> elemento de caja sobre herramientas (información sobre herramientas de widgets) Demo </ title>
  <Link rel = "stylesheet" href = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <Script src = "// code.jquery.com/jquery-1.10.2.js"> </ script>
  <Script src = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ script>
</ Head>
<Cuerpo>
 
<P>
  <a href="#" title="锚描述"> ancla de texto </a>
  <Título de entrada = "Ayuda de entrada">
</ P>
<Script>
  $ (Document) .tooltip ();
</ Script>
 
</ Body>
</ Html>