I played a little bit with the lines you sent me. Now I have the following line:
<a href="https://ark.fandom.com/wiki/The_Island"; target="_blank" class="tooltip">The Island<span class="tooltiptext">[img width=32 class="tc-image" [The Island.jpg]]</span></a> Now the image is very small, so it could be 32px. I can increase the size up to ca. 300px but I can´t make it larger. Maybe there is a limitation or anything like that in the tooltip window? Maybe I can increase the size of the tooltip window? heusmich schrieb am Montag, 10. Januar 2022 um 01:27:06 UTC+1: > 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/53e2eec4-1bb2-40d0-98b3-62b27e4524a4n%40googlegroups.com.
