On Monday, March 21, 2016 at 8:34:08 PM UTC-7, c pa wrote: > > David, > > I looked into it. TiddlyWiki 5 converts the tooltip attribute into an html > title attribute. The title attribute can't be styled. So, to get the effect > you are looking for you'ld have to do some css trick like those shown on > the w3schools site here > > http://www.w3schools.com/css/css_tooltip.asp > > I created a demo here: > http://cpashow.tiddlyspot.com/#:[[Tooltip%20Stylesheet]]%20[[Tooltip%20Demo]] > <http://cpashow.tiddlyspot.com/#Tooltip%20Demo> > > \define tooltipspan(tooltip, text) > <span class="tooltip">$text$ > <span class="tooltiptext">$tooltip$</span> > </span> > \end > > <<tooltipspan "This is a tooltip" "I have a bunch of things to say!" >> > > > \define tooltipdiv(tooltip, text) > <div class="tooltip">$text$ > <span class="tooltiptext">$tooltip$</span> > </div> > \end > > with: stylesheet = > .tooltip { > position: relative; > display: inline-block; > border-bottom: 1px dotted black; > } > > .tooltip .tooltiptext { > visibility: hidden; > width: 120px; > background-color: black; > color: #fff; > text-align: center; > border-radius: 6px; > padding: 5px 0; > position: absolute; > z-index: 1; > bottom: 150%; > left: 50%; > margin-left: -60px; > } > > .tooltip .tooltiptext::after { > content: ""; > position: absolute; > top: 100%; > left: 50%; > margin-left: -5px; > border-width: 5px; > border-style: solid; > border-color: black transparent transparent transparent; > } > > .tooltip:hover .tooltiptext { > visibility: visible; > } >
-- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/64c60ea5-d119-43ac-882d-d00640f34feb%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
