/*

1-SimpleTooltip(selector) fonksiyonu ile ToolTip uygulanacak öğeler seçilir
2-Seçilen öğelerin title attributesinde geçen değer ile ilgili div seçilir
3-ToolTip uyuglanacak öğeye hover yapılınca title kısmında belirtilen öğe gösterilir

ÖR)
// Öğe
<img src='aa.jpg' title='mytooltipDiv' class='myToolTip' />

// Çalıştır - myToolTip classına sahip öğeleri seç
SimpleTooltip('myToolTip');

// Öğenin üzerine gelincede title içinde gösterilen öğeyi hint olarak göster yani mytooltipDiv

Sonuç:
Resimin üzerine gelince mytooltipDiv divini hint olarak gösteriyoruz.

NOT:
Tooltipte hint olarak gösterilecek öğe başlangıçta gizli olmalı


*/
function ustVer(border_top, yMouse, tooltipHeight, tooltipWidth) {

    if (border_top >= yMouse - tooltipHeight) {
        return border_top + 20;
    }
    else {
        return yMouse - tooltipHeight + 20;
    }
}

function solVer(border_right, xMouse, yMouse, top_pos, tooltipHeight, tooltipWidth) {
    
    var sagPos = 0;
  
    if (border_right > tooltipWidth + xMouse + 60) {
        sagPos = xMouse;
        if (top_pos + tooltipHeight > yMouse) {
            sagPos = xMouse + 50;
        }
    }
    else {
        sagPos = border_right - tooltipWidth - 20;
        if (top_pos + tooltipHeight > yMouse) {
            sagPos = xMouse - (tooltipWidth + 20);
        }
    }

    return sagPos;
}

function SimpleTooltip(selector) {
    $(selector).each(function () {

        var my_tooltip = $("#" + $(this).attr("title"));

        $(this).removeAttr("title").mouseover(function () {
            my_tooltip.css({ display: "none" }).fadeIn(300);
        }).mousemove(function (kmouse) {

            var border_top = $(window).scrollTop();
            var border_right = $(window).width();
            var left_pos;
            var top_pos;
            var offset = 20;
            var tooltipWidth = my_tooltip.width() + 18; // padding ve borderi ekliyoruz
            var tooltipHeight = my_tooltip.height() + 18; // padding ve borderi ekliyoruz

            top_pos = ustVer(border_top, kmouse.pageY, tooltipHeight, tooltipWidth);
            left_pos = solVer(border_right, kmouse.pageX, kmouse.pageY, top_pos, tooltipHeight, tooltipWidth);

            my_tooltip.css({ left: left_pos, top: top_pos });

        }).mouseout(function () {
            my_tooltip.css({ left: "-9999px" });
        });

    });
}