hover or click ? icon for help

[njfail]

I want to create little ? icons that when you hover over them or click them, they show a little notification. Kind of like when you hover over a link with title, it'll show what the title is. Well in this case, I'd like it to show a few sentences giving people some information.

I tried searching for how to do it, but I guess I just don't know what to search for, because I couldn't find anything

Could someone tell me how this is done?

Thanks!

[VIPStephan]

That’s called “tooltip” and there is a default browser function for that – as you already noted –, the title attribute. It can be used on any element. If you want custom tooltips you can do like this:

<div class="info">
  [info icon may go here]
  <div>(text here)</div>
</div>

.info {position: relative;}
.info div {
  display: none;
  background: white;
  padding: 10px;
  width: 150px;
  top: 5px;
  left: 5px;
  position: absolute;
}
.info:hover div {display: block;}

Adjust as necessary.

[Excavator]

Hello njfail,
You can put a title on an image that works the same. If that doesn't give you enough control, there are several jQuery solutions for tooltips.