Mouse hovers over word to show information/image

[jayne]

Hi, 

I am doing a project and want to include text which when you hover over the word, a small image or small box with text appears giving more information. But I don't know what it's called? I have taken this bit from wiki as an example. Although these links just suggest clickable links. But I have seen the underlined in wiki show a little box of text or small image. I hope you know what I mean? I would so appreciate your help! Thank you, Jayne🤠

Quote

In 1981, the Association for Women in Computing inaugurated its Ada Lovelace Award.^[103][104] Since 1998, the British Computer Society (BCS) has awarded the Lovelace Medal,^[105] and in 2008 initiated an annual competition for women students.^[106] BCSWomen sponsors the Lovelace Colloquium, an annual conference for women undergraduates.^[106] Ada College is a further-education college in Tottenham Hale, London, focused on digital skills.^[107]

 

[melahi]

the tag  you need is 

<abbr title="test to appear on hover">thing to hover over</abbr>

 

[Ingolme]

I haven't checked but they most likely use AJAX to load a piece of content from the database and populate a box with it. There is Javascript and server-side code involved, it's not exactly simple.

[jayne]

12 hours ago, melahi said:

the tag  you need is 

<abbr title="test to appear on hover">thing to hover over</abbr>

 

Thank you Melahi 🤠

[jayne]

11 hours ago, Ingolme said:

I haven't checked but they most likely use AJAX to load a piece of content from the database and populate a box with it. There is Javascript and server-side code involved, it's not exactly simple.

Thank you Ingolme.  No it doesn't!  I just thought it looked really nice.😃

[patchworks101]

Hi

Could you not also use the CSS TOOLTIP function ?

Edited February 7, 2021 by patchworks101