que es un tooltip? es un mensaje emergente que sale de imagenes, textos etc etc ejemplo:

[Imagen: 334jig4.png]

bueno hace ya bastante tiempo alguien posteo un tooltip con jquery para mybb, pero no era adaptable para cualquier plantilla de mybb.

con este tooltip echo basicamente con css y etiquetas <span> lograremos un tooltip sencillo pero muy bueno.

se dirigen al panel de admin de su foro / Plantillas y Estilos / Tu Tema / global.css / editar hoja de estilo - modo avanzado /

bajan a lo ultimo y agregan este estilo :

a.Ntooltip {
position: relative; /* es la posición normal */
text-decoration: none !important; /* forzar sin subrayado */
color:#0080C0 !important; /* forzar color del texto */
font-weight:bold !important; /* forzar negritas */
}

a.Ntooltip:hover {
z-index:999; /* va a estar por encima de todo */
background-color:#000000; /* DEBE haber un color de fondo */
}

a.Ntooltip span {
display: none; /* el elemento va a estar oculto */
}

a.Ntooltip:hover span {
display: block; /* se fuerza a mostrar el bloque */
position: absolute; /* se fuerza a que se ubique en un lugar de la pantalla */
top:-2em; left:4em;  /* donde va a estar */
width:120px; /* el ancho por defecto que va a tener */
padding:5px; /* la separación entre el contenido y los bordes */
background-color: #0080C0; /* el color de fondo por defecto */
border: 1px dashed #fff; /* el borde del tooltip */
color: #FFFFFF; /* el color de los textos por defecto */
-webkit-border-top-left-radius: 10px; /* esquina redondeada  */
-webkit-border-bottom-right-radius: 10px; /* esquina redondeada */
}

None

Select All

Para que el tooltip surta efecto tiene que colocarle class="Ntooltip" y encerrar el texto que quieren en el tooltip con las etiquetas <span></span> ejemplo:

en el menu de mi web el codigo para cada imagen es el siguiente:

<td><a href="{$mybb->settings['bburl']}/index.php"><img src="/homepage_nav.png" border="0" alt="" /></a></td>

para que tooltip salga le agrege la clase Ntooltip y el span :

<td><a href="{$mybb->settings['bburl']}/index.php" class="Ntooltip"><img src="/homepage_nav.png" border="0" alt="" /><span>Portal</span></a></td>

resultado:
[Imagen: 2w57qde.png]

*Ustedes jueguen con el code css y varien en el estilo forma, color, posicion, etc, etc .. cualquier cosilla pregunten, les respondo altok.

WWWWOW Gracias Va Repu ,lo estaba buscando ,lo intentaré mañana ,que hoy ya es tarde xD, THANKS!

yo lo habia puesto, pero este es obligacion onerle class="Ntooltip", en el otro no, fdirectamente muestra el titulo y si quiere con url tam,bien sse podia habillitar o sacar

bueno el otro se dedicaba a mostrar lo que ponia en la etiqueta Title="" pero no todos queremos el tooltip en todos lados x que seria hartante, este es para aquellos textos, imagenes que queramos mostrar algo, una ayuda, un mensaje, sin afectar al foro completo.