Advertisement:

Author Topic: Agregando tooltip de Facebook  (Read 2444 times)

Offline #jsDotx3

  • Full Member
  • ***
  • Posts: 532
  • Gender: Male
  • Think Different
    • jsDotx3 on GitHub
    • @jsDotx3 on Twitter
    • K! Mundo
Agregando tooltip de Facebook
« on: July 12, 2016, 09:18:14 PM »
Agregando tooltip de Facebook

Tooltip es una buena herramiente donde podemos visualizar el titulo de una imagen, de un texto o de un link que tengamos en nuestro sitio web. Actualmente, hemos conocido el famoso "Tooltip estilo facebook", donde esa vez nos hacía descargar imagen, archivos js y css. Muchas veces nos complicamos, está vez haremos algo demasiado sencillo, agregando archivos ya existente en el CDN de Cloudflare.

El archivo que vamos a trabajar es index.template.php de tu themes.

Buscar por:
Code: [Select]
// The ?fin20 part of this link is just here to make sure browsers don't cache it wrongly.
echo '
<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/index', $context['theme_variant'], '.css?fin20" />';

Abajo agregar:
Code: [Select]
//Agregando tooltip JS
echo' <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.tipsy/1.0.3/jquery.tipsy.min.css" />';

Buscar por:
Code: [Select]
<script type="text/javascript" src="', $settings['default_theme_url'], '/scripts/script.js?fin20"></script>
Antes agregar:
Code: [Select]
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tipsy/1.0.3/jquery.tipsy.min.js"></script>
<script type="text/javascript">
  $(function() {
    $("[title]").tipsy({fade: true, gravity: $.fn.tipsy.autoNS});
  });
</script>

Resultado:


Saludos, #!jsDotx3.

Solved
(Life would be easy with a simple solution.)

Offline Príncipe_Azul

  • Full Member
  • ***
  • Posts: 623
  • Gender: Male
  • Colaborador
    • Foro ArgentinaIRC - Programación General, Informática, IRC y mIRC Scripting
Re: Agregando tooltip de Facebook
« Reply #1 on: July 13, 2016, 08:30:51 AM »
Hola, gracias por el aporte!! :)

Saludos!! :)
Foro ArgentinaIRC - Ayuda de Programación General, Informática, IRC y mIRC Scripting.

Foro de Artesanías, Recetas de cocina, Ropa para perros, Tejidos, Bijouterie, Porcelana, Chocolatería, Fondos de pantalla, Noticias, Belleza, Medicina natural, Videos y Programas: http://www.MisArtesanias.net/

Offline Rock Lee

  • Local Moderator
  • SMF Hero
  • *
  • Posts: 3,001
  • Gender: Male
  • I also speak english :D
    • BomberCode.Oficial on Facebook
    • RockLee-BC on GitHub
    • @Bomber_Code on Twitter
    • Bomber Code ~ La nueva era del conocimiento
Re: Agregando tooltip de Facebook
« Reply #2 on: July 13, 2016, 10:05:47 AM »
Parece interesante ya voy a probarlo en un smf demo tengo para ver que tal :D gracias por compartir!


Saludos!
¡Regresando como cual Fenix! ~ Bomber Code © 2018
Ayudas - Aportes - Tutoriales - Y mucho mas!!!


Ayudame via PayPal

Online d3vcho();

  • Sempiterno
  • Lead Localizer
  • SMF Hero
  • *
  • Posts: 3,940
  • Gender: Male
    • frandominguez03 on GitHub
Re: Agregando tooltip de Facebook
« Reply #3 on: July 13, 2016, 02:58:43 PM »
Tiene muy buena pinta. Lo probaré a ver qué tal. ¡Muchas gracias!

"Greeting Death as an old friend, they departed this life as equals."