25 lines
726 B
Markdown
25 lines
726 B
Markdown
importance: 5
|
||
|
||
---
|
||
|
||
# Improved tooltip behavior
|
||
|
||
Write JavaScript that shows a tooltip over an element with the attribute `data-tooltip`. The value of this attribute should become the tooltip text.
|
||
|
||
That's like the task <info:task/behavior-tooltip>, but here the annotated elements can be nested. The most deeply nested tooltip is shown.
|
||
|
||
Only one tooltip may show up at the same time.
|
||
|
||
For instance:
|
||
|
||
```html
|
||
<div data-tooltip="Here – is the house interior" id="house">
|
||
<div data-tooltip="Here – is the roof" id="roof"></div>
|
||
...
|
||
<a href="https://en.wikipedia.org/wiki/The_Three_Little_Pigs" data-tooltip="Read on…">Hover over me</a>
|
||
</div>
|
||
```
|
||
|
||
The result in iframe:
|
||
|
||
[iframe src="solution" height=300 border=1]
|