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: , , , , , , , , , , , , , , , , , ,

 

A popular feature you may come across in Web pages, is to swap images in a specific area of the page whenever you mouse over the menu's items. It is a feature that is being requested often of some of our customers too. This feature can be easily implemented by a menu that has been built by AllWebMenus Pro application.

One way to implement this feature is to go to the "Menu Editor" of the AllWebMenus Pro, choose the item(s) of the menu you want to have this behavior and then place the appropriate JavaScript code into the "JavaScript Command" property of this item (see the image below).The JavaScript code you must place into this property must be any valid JavaScript code (e.g. an already defined function in your HTML page) and it is in your responsibility to provide this valid code.

You can also implement this feature using the "Floating Image" property of the item. There you can define the image you want to appear whenever you mouse over this item and the area of your page that this image will appear by providing the appropriate x, y offsets. You can find all the appropriate information about the usage of the floating images in the following link of our company's blog site: http://www.likno.com/blog/allwebmenus-dhtml-menu-maker-floating-images-new-feature/249/

However, the second way is not recommended because you need to be more careful when managing the offsets; for example you may encounter problems in the display of your image when you re size the browser's window.

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

 


© 2009-2013 Likno Blog – Drop-Down Menus, Javascript Menus, CSS Menus, jQuery Scrollers/Sliders, Modal Windows