Tooltip BB Code

[Akimbo]

You can do that with a custom BB Code.

Very much appreciated, thank you. I was experimenting with this and realized that a hint is required so the reader knows to do a mouseover. I just wrapped the BB code syntax using the editor's color tool because my hacks at trying to include color in your HTML code failed:



It is great that the cursor doesn't change so the reader knows (or learns) not to click on it.

Syntax hack in example above:

[COLOR=rgb(41, 105, 176)][tooltip="Built-ln Breathing System"]BlBS[/tooltip][/COLOR]

IF the tooltip suggestion is accepted, it would be ideal if the color for hyperlinks were also included.

Thinking out loud: I wonder if the syntax would be better if it was closer to HTML's for adding a tooltip to a url?

<a href="https://www.scubaboard.com" title="Click for ScubaBoard’s Home Page">Tons of information on Scuba diving</a>

I imagine xenForo would have a popup dialog box like they do for links in the editor so the BB code syntax wouldn't matter so much.

 

[Paul B]

I've split the post off to stop the suggestion thread being derailed.

If you want to style the text which triggers the tooltip, you can do this:

<span data-xf-init="tooltip" title="{option}">
    <span style="color: orange">{text}</span>
</span>

Basically span the {text} element and style it as you wish.

If you also want it underlined, you would do this:

<span data-xf-init="tooltip" title="{option}">
    <span style="color: orange; text-decoration: underline">{text}</span>
</span>

If you wanted to also add a pointer to indicate it's a "link" then you would use:

<span data-xf-init="tooltip" title="{option}">
    <span style="color: orange; text-decoration: underline; cursor: pointer">{text}</span>
</span>

 

[Akimbo]

I apologize for not letting you see the results earlier. I tweaked your suggestion a little so people would know to mouseover the target.

FAQ - Tooltip BB-Code

Tooltips Have you ever been conflicted when writing in a more advanced forum because some readers might be lost by the jargon and acronyms? Example: The best tool for a survey like that is a DPV. Now imagine that sentence in a larger paragraph. You really don't want to distract your advanced...

scubaboard.com

I named it sbtooltip in case xenForo ever makes a native tooltip function that uses a simpler syntax.

<span data-xf-init="sbtooltip" title="{option}"xspan style="color:blue">{text}</span></span>

Thanks again!