How to implement customizable jquery Tooltip function on a link, text (or Image)?

  • 5 March 2014
  • 5 replies
  • 56 views

Hi,

How can implement a customizable Tooltip function to a “know more” a link, a text block, a div or (less ideally but could work) an image ?

I tried to use a title attribute on a “know more” image but the result is very poor.
The text shown been quite long, the default 1 long line image title tooltip is not attractive graphically.
I have not found a way to insert line break using a br tag for instance.

I tried to insert a jquery.tools javascript (http://jquerytools.org/demos/tooltip/…) but had not enough tech knowledge/wizdom to manage to make it work.
I am not even sure the solution works in unbounce.

I found other option like qtip2.com but once again I have not evough tech capacity to make one work, should they be comptatible with the current version of unbounce.

Last as jqery 1.4.2 is installed on my lp, I imagined there was a way to tweak a mouseover funcion. Yet I don’t know how to do it or even adapt the css…

Well, as you see, I’m stuck and I turn to the comunity to see if someone have implemented a tooltip solution.

May you can share some tips, tweaks, online ressource to check or alternate idea. All would be very welcome.

Thanks for your help.

Sebastien


5 replies

To whom may be interested, I finally got a CSS based Tooltip working in an HTML block.
I tried many but the most friendly one happened to be http://cbracco.me/a-simple-css-tooltip/

Enjoy
Sebastien

After 9 years…

Do you have that script? 

That link is not leading to it anymore. 

Chances of success of this message: 3%.

Thanks!.

Dario.

Userlevel 2
Badge

Hello @Dario777 ! Taking a shot in the dark here as I’d love to be the 3% you’re referring to haha.

 

Not sure exactly what you’re looking to accomplish from a design perspective but we do have a Community Workaround from a previous Unbouncer with a similar setup…

 

 

Have a peek at this functionality and let me know if this gets you what you’re looking for.

 

Enjoy the day!

 

Phil

Thanks!
For some reason that code isn´t working for me anymore. 

Some added an updated code at the end of the thread, but I had no succes neither. 

I´ll post a comment there, though, to see if anyone else has some opinion on it. 

Thanks for being my 3%!

D.

Userlevel 2
Badge

Ah well hopefully that helps get you closer to what you’re looking for! I’d also recommend posting the URL to the page so others can investigate.

 

Best of luck!

Reply