Advanced Tooltips Support Product Page

Solved

Tooltip only works on certain links?

Reported 27 Jan 2014 23:42:13
1
has this problem
27 Jan 2014 23:42:13 Brad Lawryk posted:
I have a page that I have tooltips set up on and I have it applied as in the tutorial for adding tooltips to a repeat region.

But it only seems to work on a few of the records and all records are set up exactly the same. Easier to show than explain.

www.scriptclub.ca/library.php

Clicking on the preview buttons should bring up the tooltip but it only works on some?

Replies

Replied 28 Jan 2014 08:39:30
28 Jan 2014 08:39:30 Teodor Kuduschiev replied:
Hello Brad,
This is caused by the special characters used in the tooltips, like: <, ', "... etc. Please set the content type to: HTML
Replied 28 Jan 2014 15:26:52
28 Jan 2014 15:26:52 Brad Lawryk replied:
Thanks Teodor,

I thought that might be it initially as well. But even set to HTML it still doesn't work. I have set it to HTML now so you can see.
Replied 28 Jan 2014 16:20:55
28 Jan 2014 16:20:55 Teodor Kuduschiev replied:
The issue seems to be with the special characters when they come from a database.
You can do the following as a workaround:
1. Create a div container inside the table cell, give it an id of "show{{stScriptId}}" and show the content of the database there inside it.
2. Add display:none to this div container
3. In the Tooltips select jquery as a content type and use: #show{{stScriptId}}
This will show the content of the div inside the tooltip.
Replied 28 Jan 2014 16:29:54
28 Jan 2014 16:29:54 Brad Lawryk replied:
Ok, I'll give that a go. On further testing it seems that only the ' causes the problem as far as I can see.
Replied 28 Jan 2014 16:44:25
28 Jan 2014 16:44:25 Brad Lawryk replied:
That works, sort of ......... the tooltip shows on all of them but shows blank because of the display:none.

So I assume I need to change that to display:block somewhere ... where would I add that?
Replied 28 Jan 2014 17:15:16
28 Jan 2014 17:15:16 Teodor Kuduschiev replied:
You can add the following css in order to hide the container initially and the when loaded into the tooltip to show it:

.hidden {
	display:none;
}
.dmxtooltipcontent > .hidden {
	display:block;
}

Just add a class="hidden" to your container.
Replied 28 Jan 2014 17:22:59
28 Jan 2014 17:22:59 Brad Lawryk replied:
Actually I found an easier solution that seems to be working.

I surrounded my content div with another div that I marked as display none.

I left my actual content div without a display property and used the query method to show the content div. And since the content div itself isn't hidden it was able to show properly.

Little bit of an odd work around but it seems to be working.

Thanks for pointing me in the right direction!
Replied 28 Jan 2014 17:30:30
28 Jan 2014 17:30:30 Brad Lawryk replied:
Working like a charm! Love it!

Reply to this topic