Knowledge Base support case for Likno Web Tooltips Builder, abstracted and stripped of all user’s private info.


Initial Email From:
Todd
Initial Email Subject: Tooltips Not Working
Support Case Month: October 2012

Greetings! The reason for this email is to see if I can get your help with implementing my first webpage with the Web Tooltips Builder app.

I follow the instructions to the best of my ability, but the URL that I provided proves that I am not successful. In particular, scroll down to the graphical legend titled "Flexibility w Self-Directed Care Services" and try to hover on the Support Broker Services wording on the left-hand side.

Any help is most appreciated to determine where I am goofing up. I thank you kindly for any help that you can provide .

Todd

Related URL: http://www.loriknappcompanies.com/new/services/independentliving/selfdirectedcare.asp

Reply From: Likno Customer Support

Dear Todd,

I checked your page and it seems that there is no Tooltip Linking Code there!

Did you Compile your Tooltip project and Link it to your page(s)?

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Todd

Hello, Kostas.  I apologize for the confusion… I put the linking code on separate page by accident.

However, the linking code did not seem to resolve the issue.  Could you take a peek or more time for me?

Thank you so much, Kostas.

Reply From: Likno Customer Support

It seems the problem is with the <area>:

tooltip area

It never shows anyway, so neither does the tooltip!

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Todd

Weird, I’m not seeing what you’re seeing.  The link code is at the top (inside the <body> tag), and the ID is embedded inside the <area> as shown below.

       <map name="Map" id="Map">

                          <area shape="rect" coords="32,7,298,41" href="#" id="Support_Broker_Services" />

                        </map>

Is the html.css something that is tied in with my Likno installation?  My CSS is _css2.css.

Reply From: Likno Customer Support

Dear Todd,

I just realized another issue in your page and this might be causing all the problems.

It seems that you have duplicate content or at least IDs, which is considered invalid HTML. Specifically you have two different sets of “map” to “map4”.

Please make sure that you only have one and that there are no duplicate IDs in your page. Let me know if this corrects the problem.

I also did some further tests with your page and the problem may be caused by an older issue in loading order between some of our products.

Could you please make sure that you use the latest versions of our builders and specifically for Modal Windows? It seems that you are using a much older version that worked with a different loading system and conflicts with the Tooltips library when loaded last. With the new version there should be no problem regardless of the loading order.

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Todd

Greetings, Kostas!  I updated all of the Likno products and uploaded the code to our Web server.  Unfortunately, this didn't resolve the issue.

Regarding your reference to the different "map" references, I have created these because the actual legend graphic is comprised of slices, or different graphics.  When the use of the different map references be valid HTML?

I did an experiment:

1. Just to play it safe, I created a new webpage that only has one map reference.  That didn't resolve the issue either.

2. I created DIV tag and tested Tooltips.  Worked like a charm.  Hover over the “Click on me, Kostas!”  reference toward the middle of the page.

So, there seems to be some kind of issue with Area tags for me.  Any thoughts?  Once again, I thank you very kindly, Kostas?

Reply From: Likno Customer Support

Dear Todd,

Sorry for this back & forth of emails. In my last test I saw the problem with older versions but I focused on Modal Windows, while it seems that you also have an older version of Accordion.

Can you please update this too? I did a test in your new page and as soon as I removed the current accordion code the tooltips worked fine.

Regarding the maps, there is no problem with having “map, map1, map2” etc. The problem occurs (or may occur, mostly in IE) when you have duplicates of “id=map” or any other single ID.

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Todd

Your recommendations seem to do the trick!  Thank you so much.

One last question: there are many Tooltips on this page that have a button (i.e. from Button Maker) that opens up a Modal Window pop up.  On this page, when I click on the "VIEW Definition (Pop-up)" button the modal window pops up but the Tooltip remains until I hover off.  Is there any creative workaround for this?

Cheers, and thank you so much again ask?

Reply From: Likno Customer Support

Dear Todd,

You did not send me the page again… Smile

In any case, the main idea is that you have an image (ButtonMaker button) in your tooltip which onclick opens a modal window. You should also have it close the tooltip. This should look something like this:

blah blah blah <a href="javascript:void(0);" id="my_tooltip">tooltip trigger</a> blah blah blah

Tooltip content:

blah blah blah <img src="myimage.png" onclick="Modal_Window_1(); lQuery('#my_tooltip').likno_tooltip('hide');" /> blah blah blah

I hope you get the main idea. If not, send me the URL and I will give you more specific instructions.

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Tags: , , , , , , , , , , , , , , , , , ,