Showing another passage's text on hover

Twine Version: 2.9.0
Story Format: SugarCube 2.36.1

Hi! I’m trying to include text from another passage when a user hovers over a certain word to basically give them a definition of said word. I want users to be able to see the definition for this word in multiple spots, so I wanted to include it in its own passage instead of copying and pasting the definition all over the place.

I’ve figured out how to show text on hover using and how to show text from another passage using <>, but I can’t figure how to <> text within a . If there’s a better/easier way to do this, that works too!

Sorry if this has been asked before - I tried looking for a solution, but I wasn’t able to find my exact problem. I’m also a complete novice if that wasn’t obvious!

Welcome ElementFive.

I did something alike, hovering a word to get a definition. I used the stylesheet and a widget. Of course you don’t have to use the same colors, but it’s a canvas you can alter however you need.

Stylesheet:

a.definition {font-weight: normal;
	text-decoration: underline dotted;
  	color: lightgreen;
  	} 
a.definition span {
    z-index:10;
    display:none; 
    padding:10px 10px;
 	max-width: 600px;
  	margin: left;
}
a.definition:hover span{
    display:inline; 
    position:absolute;
  	border: 1px dotted lightgreen;
    color: lightgreen;
    background: black;
}

Any passage with the tag ‘widget’. Something named ‘Definitions’ would be perfect.

<<widget "definition">><a data-passage="" class = "definition"><span><<switch _args[0]>><<case "word 1">>Definition of word 1, it can include words, macros, pictures and so on.<<case "word 2">>Definition of word 2, it can include words, macros, pictures and so on.<</switch>><</widget>>

Anywhere in the story:

<<definition "word 1">>