How to make links with tooltip text?

Mark S.

unread,

Apr 8, 2009, 12:00:36 AM4/8/09

to TiddlyWiki

You can make an image with a link and tooltip text that appears as you
hover over the image. And the default Tiddler behavior is to give you
custom hover text as you linger over a link. But how do you create a
link in which you can specify the hover text? I've tried creating <a>
elements inside of <html> tags, specifying the help text in the 'alt'
attribute, but that doesn't seem to do it.

Thanks,
Mark

FND

unread,

Apr 8, 2009, 7:34:26 AM4/8/09

to Tiddl...@googlegroups.com

> how do you create a link in which you can specify the hover text?
> I've tried creating <a> elements inside of <html> tags, specifying
> the help text in the 'alt' attribute, but that doesn't seem to do it.

The ALT attribute is alternate text in case the image cannot be
displayed*. What you want there is the TITLE attribute.

TiddlyWiki doesn't have any special markup for this, so using raw HTML
is probably the best way.

-- F.

* http://www.w3.org/TR/html401/struct/objects.html#alternate-text

Eric Shulman

unread,

Apr 8, 2009, 9:36:17 AM4/8/09

to TiddlyWiki

> > how do you create a link in which you can specify the hover text?
> > I've tried creating <a> elements inside of <html> tags, specifying

> The ALT attribute is alternate text in case the image cannot be
> displayed*. What you want there is the TITLE attribute.
> TiddlyWiki doesn't have any special markup for this, so using raw HTML
> is probably the best way.

This little trick will work:
[[test this|About]]<<tiddler {{place.lastChild.title='it works';''}}
>>

The first parameter for the <<tiddler>> macro is supposed to be a
tiddler name. However, instead of using literal text, we are using a
computed parameter that actually sets the title attribute of the
immediately preceding element (e.g, the tiddler link), and then ends
with a blank string (e.g., '') so that there is no matching tiddler
name to transclude and no extra output is rendered.

Note: while this works, the syntax is a bit technical and thus harder
to read and more prone to mistakes. One way to address this is to
define a quick *alias* macro using
http://www.TiddlyTools.com/#AliasPlugin

After installing the plugin, define the following alias (put it in
MainMenu or any other tiddler that is rendered at startup):

<<alias tooltip {{"\<\<tiddler \{\{place.lastChild.title='%0';''\}\}\>
\>"}}>>

Then, to invoke it:

[[test this|About]]<<tooltip 'it works'>>

enjoy,
-e
Eric Shulman
TiddlyTools / ELS Design Studios

Eric Shulman

unread,

Apr 8, 2009, 9:42:19 AM4/8/09

to TiddlyWiki

errata:

* missing closing ">>" on tiddler macro:

[[test this|About]]<<tiddler {{place.lastChild.title='it works';''}}>>

* remove word-wrapping newline added by GoogleGroups:

<<alias tooltip
{{"\<\<tiddler \{\{place.lastChild.title='%0';''\}\}\>\>"}}>>

enjoy,
-e

Mark S.

unread,

Apr 8, 2009, 1:58:15 PM4/8/09

to TiddlyWiki

This is very clever!

Are there some special restrictions on its use? Like versions? I'm
using TW notes, and it doesn't seem to work there. Gives the error:

1. Error while executing macro <<tiddler>>:
2. Unable to evaluate {{place.lastChild.title='it works';''}}:
TypeError: place.lastChild is null

But it works fine in an almost bare-bones TW with updated core 2.5.0.

Thanks!
Mark

Eric Shulman

unread,

Apr 8, 2009, 2:11:28 PM4/8/09

to TiddlyWiki

> using TW notes, and it doesn't seem to work there. Gives the error:
> 1. Error while executing macro <<tiddler>>:
> 2. Unable to evaluate {{place.lastChild.title='it works';''}}:
> TypeError: place.lastChild is null
> But it works fine in an almost bare-bones TW with updated core 2.5.0.

You need to be using TW2.4.3 or above. For earlier versions of TW,
you can retrofit the code by installing:
http://www.TiddlyTools.com/#CoreTweaksArchive
(specifically, CoreTweak #444, which adds the needed 'place'
definition)

Mark S.

unread,

Apr 8, 2009, 2:21:17 PM4/8/09

to TiddlyWiki

You're the man!

Worked fine after that tweak!

-- Mark

alex

unread,

Apr 21, 2009, 5:16:21 PM4/21/09

to TiddlyWiki

I am looking for a similar solution.
I'd like to change the tooltip on links so that it doesn't display
siteSubtitle and the modifier. I want to remove these as the purpose
is a webpage.

For example I have a tiddlyLinkExisting [[About]]
When I mouse over it says something like "About - AlexHough - 21
April 23:00 2009"

I would like for it so simply show "About" the tiddler title.

I've tried the following methods to find the bit of code to change:
1) searched code for "tooltip"
2) looked at http://tiddlyweb.test.tiddlywiki.org:8080/insidetw/recipes/insidetw/tiddlers.wiki
to see if there is a anything.

I am looking for something that has tooltip title and subtitle but
can't find it anywhere.

Any pointers are most welcome

Alex

On Apr 8, 5:00 am, "Mark S." <throa...@yahoo.com> wrote:
> You can make an image with a link andtooltiptext that appears as you

Eric Shulman

unread,

Apr 21, 2009, 5:19:56 PM4/21/09

to TiddlyWiki

> I'd like to change the tooltip on links so that it doesn't display
> siteSubtitle and the modifier. I want to remove these as the purpose
> is a webpage.

Try this:
http://www.TiddlyTools.com/#CoreTweaks##637

enjoy,
-e

alex

unread,

Apr 21, 2009, 6:08:29 PM4/21/09

to TiddlyWiki

I added the following to my configTweaks tiddler

config.messages.tiddlerLinkTooltip='%0';

Thanks Eric.
btw, I had diffiuclties navigating tiddlytools tonight. I crashed
Firefox v3.0.8 on my MBP twice. The thrid time was very slow. In the
end I used a version I downloaded to my local drive.

Reply all

Reply to author

Forward