$(function () {
    $('.rollover').each(function () {

        var top = $(this).position().top + 10;
        var left = $(this).position().left + 10;


        var hideDelay = 50;
        var hideDelayTimer = null;

        var shown = false;

        var trigger = $('.trigger', this);
        var popup = $('.popup', this);

        $([trigger.get(0), popup.get(0)]).mouseover(function () {
            // zrus schovavani kdyz jdeme do popup okna
            if (hideDelayTimer) clearTimeout(hideDelayTimer);

            // pokud neni nakresleno, zobraz
            if (!shown) {
                popup.css({
                    top: top+"px",
                    left: left+"px",
                    display: 'block'
                });

                shown = true;
            }
        }).mouseout(function () {
            // pokud je nastaven timer, tak ho vymaz
            if (hideDelayTimer) clearTimeout(hideDelayTimer);

            // timer si schovame, abychom ho mohli v pripade mouseover vymazat
            hideDelayTimer = setTimeout(function () {
                hideDelayTimer = null;
                shown = false;
                popup.css('display', 'none');
            }, hideDelay);
        });
    });
});