I’ve been trying to research this on my own, but since the addition of the AI image generator, googling any perchance with the word “image” in it has kinda overwhelmed the results with questions about that, so finding out if this has already been asked has been unfruitful lmao.

I am attempting to add a tooltip to an image that’s called via the line editor, currently it reads:

<img style\="height:12px" src\="[buy.Cons.PowerCharge.img]"/> <b> [tooltip(buy.Cons.PowerCharge.name, buy.Cons.PowerCharge.desc)] </b>

With this, the image appears at the size and location desired. However, I want the ability to hover over the small 12 px image to view it larger, using the tooltip options feature to allow for html and thus, images, but I keep recieving an error that something about the initial image html as the target for tooltipping isn’t working.

[tooltip(<img style\="height:12px" src\="[buy.Cons.PowerCharge.img]"/>, example text)]

The above gives me errors tagged around the img and style sections, or it will complain about missing a closing bracket despite one clearly being there.

tl;dr What is the format for applying a tooltip to an image in the list editor?

  • perchanceMEnglish
    1·
    2 days ago

    This should do the trick:

    [tooltip("<img style=\"height:12px\" src=\"[buy.Cons.PowerCharge.img]\"/>", "example text")]

    There are a couple of gotchas here which are easy to trip on:

    • Since we’re writing code inside a square block, we don’t need to backlash before the equals signs.
    • Since we’re using quotes-within-quotes, we need to put backslashes before the inner quotes.

    For the second issue, you can actually use single quotes for the outer quotes instead, which means you don’t need to backslash the inner quotes:

    [tooltip('<img style="height:12px" src="[buy.Cons.PowerCharge.img]"/>', "example text")]

    Pro tip: This, btw, is just regular JavaScript stuff (the syntax/code inside square blocks is always just executed as JavaScript), rather than anything specific to the perchance engine itself, so you can ask an AI something like:

    why isn’t this javascript working? tooltip(<img style=“height:12px” src=“[buy.Cons.PowerCharge.img]”/>, example text)

    And it should give you an answer even if it doesn’t know anything about perchance (though it may be a bit confused by [buy.Cons.PowerCharge.img] because that’s perchance syntax, and it probably expects to see a plain https url there in place of that).