init

02-ui/05-widgets/06-widget-tasks/01-tooltip-over-element/task.md

@@ -0,0 +1,32 @@
+# Подсказка над элементом
+
+[importance 5]
+
+Создайте всплывающую подсказку над элементом. 
+
+Подсказка должна появляться при наведении на элемент, по центру и на небольшом расстоянии сверху. При уходе курсора с элемента -- исчезать.
+
+Вы можете посмотреть поведение подсказки в ифрейме ниже, наведя курсор на ссылку.
+
+[iframe src="solution" height=200 link border=1]
+
+Способ добавления подсказки к элементу:
+
+```js
+new Tooltip({
+  elem: $('#elem'), 
+  html: "Вот <b>такая</b> подсказка!",
+  // вертикальное расстояние от подсказки до элемента
+  offset: 20 // необязательный параметр, по умолчанию 10
+});
+```
+
+<ul>
+<li>В подсказке и элементе, на который она поставлена, может быть произвольный HTML. Оформление подсказки должно задаваться CSS.</li>
+<li>Подсказка не должна вылезать за пределы экрана, если нельзя показать сверху -- показывать снизу элемента.</li>
+<li>Объект подсказки не должен иметь публичных методов, только приватные.</li>
+</ul>
+
+[edit src="task" task/]
+
+P.S. Подсказки, если их мало, можно реализовать и при помощи CSS. Но JS-подход более универсален и не зависит от вёрстки, в частности, он может проверять, не вылезает ли подсказка за экран.