# События

Три события имеют отношение к подсказке:
<ol>
<li>При `mouseover` -- показать.</li>
<li>При `mousemove` -- показать на новом месте.</li>
<li>При `mouseout` -- спрятать.</li>
</ol>

...Но при заходе на элемент происходят сразу оба события: `mouseover` и `mousemove` на нём же. Зачем вызывать код для показа два раза? Можно оставить его только в `mousemove`.

Стиль элемента подсказки:

```css
.tooltip {
  position:absolute;
  z-index:100; /* подсказка должна перекрывать другие элементы */
  ...
}
```

# Решение

[edit src="solution"]Решение в песочнице[/edit]

В нём есть две тонкости.
<ol>
<li>Для того, чтобы можно было получить высоту и ширину, подсказку надо сначала показать.</li>
<li>При показе -- важно, чтобы подсказка не оказалась *под* курсором. Если такое произойдет, то дальнейшие события `mousemove` станут происходить *уже на подсказке*, а не на элементе, и их обработка сломается.</li>
</ol>