// Alternative Tooltip.js
// リンク先が画像の場合画像もツールチップに表示したり。


document.addEventListener('load', showTooltip, false);

function showTooltip() {
    var ancs = document.links;
    for(var i=0,len=ancs.length;i<len;i++) {
        ancs[i].onmouseover = popups;
        ancs[i].onmouseout  = popdowns;
    }
}

function popups(e) {
    url   = this.href;
    title = this.title;
    chk   = false;
    if(!this.title) {
        content = 'URL: '+ url;		
    } else {
        content = 'Title: ' + title + '<br />URL : '+ url;
    }
    defx = e.clientX + document.body.scrollLeft + 10;
    defy = e.clientY + document.body.scrollTop - 35;
    tID  = setTimeout("tipShow()",1000); // ツールチップを表示するまでの時間。
}

function tipShow() {
    tltp = document.createElement('div');
    tltp.id = 'ppps'
        with(tltp.style) {
            visibility = 'visible';
            position   = 'absolute';
            minWidth   = '200px';
            top        = defy;
            padding    = '2px';
            background = '#000' //ツールチップの背景の色
            color      = '#fff'; //ツールチップの文字の色
            textAlign  = 'left';
            fontSize   = '12px'; //ツールチップの文字の大きさ
            border     = '1px solid #fff';
        }
    if(innerWidth < (250 + defx)) {
        tltp.style.left = innerWidth - 230;
    } else {
        tltp.style.left = defx;
    }
    if (url.match(/^.*\.(jpe?g|bmp|gif|png)$/i)) {
        tltp.innerHTML = '<img src=\"' + url + '" style=\"max-width:396px;\"alt=\"\" /><br />' + content;
    } else {
        tltp.innerHTML = content;
    }
    document.body.appendChild(tltp);
}

function popdowns() {
    clearTimeout(tID);
    tltp.style.visibility = 'hidden';
}