Красивая глобальная кроссбраузерная всплывающая подсказка

Это ссылка

Исходный код этого примера:

<style type="text/css">
#tooltip {
	background: #fff;
	border: 2px solid #ADC1CE;
	font: 1.7em Verdana,Geneva,Arial,Helvetica,sans-serif;
	margin: 0;
	border-radius: 8px;
	padding: 3px 5px;
	position: absolute;
	visibility: hidden;
}
</style>
<p>
    <a href="http://kdg.htmlweb.ru/" title='Это моя домашняя страница'>
        Это ссылка
    </a>
</p>
<script type="text/javascript">
// отключение вывода сообщений об ошибках
window.onerror = null;
var tooltip_attr_name = "tooltip"; // наименование создаваемого tooltip'ого атрибута
// функция вызывается при загрузке страницы
window.onload = function(e){
        // если браузер поддерживает DOM и создание элементов, то мы запускаем механизм создания tooltip'а
        if (document.createElement) tooltip.d();
}

// объект tooltip
tooltip = {
       // создание слоя, в котором будет находится текст подсказки (точнее, TextNode, содержащий текст)
       t: document.createElement("DIV"),
       // таймер
       c: null,
       // флаг, указывающий показана ли сейчас на экране подсказка
       g: false,
       // обработчик события onMouseMove
       m: function(e){
               // если подсказка была вызвана на экран
               if (tooltip.g){
                       // важно! определяем канву, учитывая режим совместимости в IE 6
                       oCanvas = document.getElementsByTagName(
                       (document.compatMode && document.compatMode == "CSS1Compat") ? "HTML" : "BODY"
                       )[0];
                       // x-координата, где произошёл вызов подсказки
                       x = window.event ? event.clientX + oCanvas.scrollLeft : e.pageX;
                       // y-координата, где произошёл вызов подсказки
                       y = window.event ? event.clientY + oCanvas.scrollTop : e.pageY;
                       // вывод подсказки на экран (задание координат)
                       tooltip.a(x, y);
               }
       },
       d: function(){
              // установка атрибута id со значением tooltip (который описан у нас в CSS)
               tooltip.t.setAttribute("id", "tooltip");
               // добавление к элементу body дочернего объекта tooltip
               document.body.appendChild(tooltip.t);
               /* далее мы считываем в массив все элементы, затем у тех,        которые имеют HTML атрибуты title и alt задаём      новый атрибут tooltip_attr_name (текст подсказки);              мы также задаём обработчики событий onMouseOver и onMouseOut */
               a = (document.all) ? document.all : document.getElementsByTagName("*");
               aLength = a.length;
               for (var i = 0; i < aLength; i++){
                       if (a[i].getAttribute("title")){
                               a[i].setAttribute(tooltip_attr_name, a[i].getAttribute("title"));
                               a[i].removeAttribute("title");
                               if (a[i].getAttribute("alt") && a[i].complete) a[i].removeAttribute("alt");
                               tooltip.l(a[i], "mouseover", tooltip.s);
                               tooltip.l(a[i], "mouseout", tooltip.h);
                       }else
                               if (a[i].getAttribute("alt") && a[i].complete){
                                       a[i].setAttribute(tooltip_attr_name, a[i].getAttribute("alt"));
                                       a[i].removeAttribute("alt");
                                       tooltip.l(a[i], "mouseover", tooltip.s);
                                       tooltip.l(a[i], "mouseout", tooltip.h);
                               }
               }
               // задаём для документа обработчик события onMouseMove
               document.onmousemove = tooltip.m;
               // прячем подсказку при скроллинге
              window.onscroll = tooltip.h;
       },
       // подготавливаем подсказку для вывода на экран

       s: function(e){
               // получаем объект, у которого будет показана подсказка
               d = (window.event) ? window.event.srcElement : e.currentTarget;
               // нелишняя проверка на наличее свойства tooltip_attr_name
               if (!d.getAttribute(tooltip_attr_name)) return;
               // удаляем у слоя с подсказкой первый дочерний объект (TextNode с текстом), если он вдуг не удалился раньше
               if (tooltip.t.firstChild) tooltip.t.removeChild(tooltip.t.firstChild);
               /* добавляем к элементу t (слой) новый TextNode, содержащий текст,        взятый из свойства tooltip_attr_name активного объекта */
               tooltip.t.appendChild(document.createTextNode(d.getAttribute(tooltip_attr_name)));
               // показываем подсказку с задержкой в 0,5 секунды
               tooltip.c = setTimeout("tooltip.t.style.visibility = 'visible';", 500);
               // устанавливаем флаг, сигнализирующий о том, что подсказка у нас на экране
               tooltip.g = true;
       },
       // удаляем подсказку с экрана

       h: function(e){
               // прячем подсказку
               tooltip.t.style.visibility = "hidden";
               // удаляем у слоя с подсказкой первый дочерний объект (TextNode с текстом)
               if (tooltip.t.firstChild) tooltip.t.removeChild(tooltip.t.firstChild);
               // убираем задержку
               clearTimeout(tooltip.c);
               // устанавливаем флаг
               tooltip.g = false;
               // с глаз долой:
               tooltip.a(-99, -99);
       },

       // делаем так, чтобы элементы с title и alt нужным образом реагировали на события onMouseOver и onMouseOut
       l: function(o, e, a){
               if (o.addEventListener) o.addEventListener(e, a, false); // было true (не работает в Opera 7)
               else if (o.attachEvent) o.attachEvent("on" + e, a);
                       else return null;
       },

       // устанавливаем координаты всплывающей подсказки
       a: function(x, y){
               // важно! определяем канву, учитывая режим совместимости в IE 6
               oCanvas = document.getElementsByTagName(
               (document.compatMode && document.compatMode == "CSS1Compat") ? "HTML" : "BODY"
               )[0];
               w_width = window.event ? oCanvas.clientWidth : window.innerWidth;
               t_width = window.event ? tooltip.t.clientWidth : tooltip.t.innerWidth;
               t_extra_width = 7; // padding + borderWidth;

               // y-координата
               tooltip.t.style.top = y + 8 + "px";
               // x-координата
               tooltip.t.style.left = x + 8 + "px";

               // bugfix! делаем так, чтобы подсказка не вылазила за границы окна
               while (x + t_width + t_extra_width > w_width){
                       -x;
                       tooltip.t.style.left = x + "px";
                       t_width = window.event ? tooltip.t.clientWidth : tooltip.t.innerWidth;
               }
       }
}
</script>