That´s what I wrote, I already tried that, but it doesn´t change anything. The size of the tooltip is always the same...
[email protected] schrieb am Montag, 10. Januar 2022 um 01:24:00 UTC+1: > .tooltip .tooltiptext { > visibility: hidden; > *width:300px;* > background-color: black; > color: #fff; > text-align: center; > border-radius: 6px; > padding: 5px 0; > > On Sunday, January 9, 2022 at 8:05:17 PM UTC-4 heusmich wrote: > >> OK, I still have a problem with the size of the images. I only need it >> for one tiddler. >> I put the content above between the style tags at the beginning of the >> tiddler and changed the width from 120px to 1024px, but it doesn´t change >> anything. >> The size of the image is always the same. Do you still have an idea how I >> can change the size? >> >> [email protected] schrieb am Montag, 10. Januar 2022 um 00:38:39 UTC+1: >> >>> That's good stuff ! >>> >>> I've never done that before, so thanks for patiently bearing with me ! >>> >>> Very neat way not just to setup links but to view anything on hover over >>> something. >>> >>> BTW, instead of *{{Motovun Jack.jpg}}*, you could use the TiddlyWiki >>> image widget <https://tiddlywiki.com/#ImageWidget> to size the tooltip >>> image juuuuust right. I think ... >>> >>> On Sunday, January 9, 2022 at 7:21:50 PM UTC-4 heusmich wrote: >>> >>>> Now it´s working as I wanted it, thank you very much! >>>> :D >>>> >>>> [email protected] schrieb am Montag, 10. Januar 2022 um 00:17:05 UTC+1: >>>> >>>>> I'm pretty sure you're going to need to forget about using WikiText >>>>> for that kind of link to the external website. >>>>> >>>>> Go to tiddlywiki.com, and put the following in a tiddler: >>>>> >>>>> <style> >>>>> .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 the tooltip */ >>>>> position: absolute; >>>>> z-index: 1; >>>>> } >>>>> >>>>> .tooltip:hover .tooltiptext { >>>>> visibility: visible; >>>>> } >>>>> </style> >>>>> *<a href="https://ark.fandom.com/wiki/The_Island >>>>> <https://ark.fandom.com/wiki/The_Island>" target="_blank" >>>>> class="tooltip">The Island<span class="tooltiptext">{{Motovun >>>>> Jack.jpg}}</span></a>* >>>>> >>>>> For your own TiddyWiki, if you only need the styling for the one >>>>> tiddler, you might as well put all of the style stuff at the start of >>>>> that >>>>> one tiddler. If you need this kind of thing in more than one tiddler, >>>>> then >>>>> you'll want to put the stuff between the style tags in a stylesheet >>>>> tiddler. >>>>> >>>>> That last line, the link line, is what you need instead of [[The >>>>> Island|https://ark.fandom.com/wiki/The_Island]] >>>>> On Sunday, January 9, 2022 at 6:28:26 PM UTC-4 heusmich wrote: >>>>> >>>>>> OK, in general this is working. I tried it and I can add an image >>>>>> that I uploaded to my TiddlyWiki before and it will be shown as the >>>>>> tooltip. >>>>>> But I don´t know how I can use this in my case. >>>>>> Problem is, I have a table with a few rows and columns. >>>>>> In one cell of this table for example I have the following content: >>>>>> >>>>>> | [[The Island|https://ark.fandom.com/wiki/The_Island]] | >>>>>> >>>>>> This creates a link with the name "The Island" and the target address >>>>>> is "https://ark.fandom.com/wiki/The_Island";, but only the name "The >>>>>> Island" is shown in the cell. >>>>>> So now I want to show a map of "The Island" as a tooltip when I hover >>>>>> over the name "The Island". >>>>>> I don´t know how I have to write the code and how I add it to the >>>>>> table to make this working... >>>>>> Can you tell me, what exactly I have to do? >>>>>> >>>>>> [email protected] schrieb am Sonntag, 9. Januar 2022 um 22:56:51 >>>>>> UTC+1: >>>>>> >>>>>>> I'm pretty sure you can do that with the following as a guide: >>>>>>> https://www.w3schools.com/css/tryit.asp?filename=trycss_tooltip >>>>>>> >>>>>>> Instead of a span of text, an image of that class should do the >>>>>>> trick. >>>>>>> >>>>>>> On Sunday, January 9, 2022 at 4:58:01 PM UTC-4 heusmich wrote: >>>>>>> >>>>>>>> Hi @all, >>>>>>>> >>>>>>>> I know the I can show text as a tooltip for an image and I know how >>>>>>>> to do it. >>>>>>>> But now I´m wondering if it´s also possible to show an image as a >>>>>>>> tooltip. >>>>>>>> In some of my documents I have links to different internet pages >>>>>>>> and now - if possible - I want to show a picture when I hover with my >>>>>>>> mouse >>>>>>>> over the link. >>>>>>>> Does anybody know if this is possible somehow? >>>>>>>> >>>>>>>> Best regards >>>>>>>> heusmich >>>>>>>> >>>>>>> -- 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 [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/18af9894-846a-4e76-94c1-a1f32b8ac8fbn%40googlegroups.com.
