//div ID
var myDivId = 'ZHintDiv';
//posun v ose X
var movingX = 20; //px
//posun v ose Y
var movingY = 10; //px


//vychozi pozice
var positionX = 0;
var positionY = 0;

//vytvorime novy element typu DIV
var divElement;
divElement = document.createElement('div');
//nastavime ID
divElement.setAttribute('id', myDivId);
//visibility:hidden
divElement.style.visibility = 'hidden';
//positin: absolute
divElement.style.position = 'absolute';
//vychozi pozice
divElement.style.left = '0px';
divElement.style.top = '0px';

//zjisteni souradnic mysi
function getMouseXY(e) {
//alert('test');

    var browserIE = document.all?true:false
    if (!browserIE) document.captureEvents(Event.MOUSEMOVE)
    //zjisteni souradnic
    positionX = browserIE?event.clientX + document.body.scrollLeft:e.pageX;
    positionY = browserIE?event.clientY + document.body.scrollTop:e.pageY;
    //posun elementu
    setPosition();

    return true;
}

//nastaveni pozice okna
function setPosition(){
    var windowWidth = 0;
    //zjisteni sirky okna
    if( typeof( window.innerWidth ) == 'number' ) {
        windowWidth = window.innerWidth;
    } else if( document.documentElement && document.documentElement.clientWidth ) {
        windowWidth = document.documentElement.clientWidth;
    } else if( document.body && document.body.clientWidth  ) {
        windowWidth = document.body.clientWidth;
    }
    //pokud je pozice za okrajem okna, nastavi se pred kurzor
    if( ( positionX +  parseInt(divElement.style.width ) + movingX + 50 ) > windowWidth ){
        positionX -= ( movingX + parseInt(divElement.style.width ) );
    }
    divElement.style.left =  ( movingX + positionX ) + 'px';
    divElement.style.top = ( movingY + positionY ) + 'px';
}


//funkce pro nastavei opacity
function setOpacity( element, alpha ){
    var el = document.getElementById(element);

    if( el.style.opacity != undefined ){
        el.style.opacity = alpha;
    }
    else if( el.style.MozOpacity != undefined ){
        el.style.MozOpacity = alpha;
    }
    else if( el.style.filter != undefined ){
        el.style.filter = "alpha(opacity=0)";
        el.filters.alpha.opacity = ( alpha * 100 );
    }

    return true;
}

function pulseOn(){
    for( i = 0; i <= 9; i++ ){
        setTimeout("setOpacity('" + myDivId + "'," + i/10 + ");", 25*i);
    }
}



function getElementLeft(elem) {

/*
        if(document.getElementById) {
            var elem = document.getElementById(elem);
        } else if (document.all) {
            var elem = document.all[elem];
        }
  */

        var yPos = elem.offsetLeft;
        tempEl = elem.offsetParent;
        while (tempEl != null) {
              yPos += tempEl.offsetLeft;
              tempEl = tempEl.offsetParent;
          }
        return yPos;

    }
    
function getElementTop(elem) {
/*
        if(document.getElementById) {
            var elem = document.getElementById(elem);
        } else if (document.all) {
            var elem = document.all[elem];
        }
  */
        var yPos = elem.offsetTop;
        tempEl = elem.offsetParent;
        while (tempEl != null) {
              yPos += tempEl.offsetTop;
              tempEl = tempEl.offsetParent;
          }
        return yPos;

    }

//TOOLTIP FUNCTION
function tooltip( str, el ){
    //pokud neni vytvoreny div pridany v HTML
    if( !document.getElementById(myDivId) )
        //pridame div do stranky
        document.body.appendChild(divElement);
    //nastavime pozadovanou sirku pro div
   // divElement.style.width = width + 'px';
    //nastavime visibility:visible
    setOpacity(myDivId, 0 );
    divElement.style.visibility = 'visible';
   // divElement.style.top = el.style.top;
    //divElement.style.left = el.style.left;
    pulseOn();
    //vlozime do divu nas text
    divElement.innerHTML = str;
    //pri posunu po elementu menime pozici divu
    //el.onmousemove=getMouseXY;
    //pri opusteni elementu okno schovame
  //  el.onmouseout = hidetip;
  

  positionX = getElementLeft(el) + 5;
  positionY = getElementTop(el) + 5;
  setPosition();
}

//schovani okna
function hidetip(){
    divElement.style.visibility = 'hidden';
}