function tips_close(e){

	var element = document.body;   
	element.removeChild(document.getElementById('tips_above'));   

}

/* ---------------------------------------------------------*/
/* ロードしたデータを表示 */
/* ---------------------------------------------------------*/

//必要となるGlobal変数の定義
// 間違いのないように全文字列を小文字に変換
var agt = navigator.userAgent.toLowerCase();
var is_ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
var is_gecko = (agt.indexOf('gecko') != -1);
var is_opera = (agt.indexOf("opera") != -1);

//要素のスタイル属性を取得する関数
function getElementStyle(targetElm,IEStyleProp,CSSStyleProp) {
	var elem = targetElm;
	if (elem.currentStyle) {
	return elem.currentStyle[IEStyleProp];
	} else if (window.getComputedStyle) {
	var compStyle = window.getComputedStyle(elem,"");
	return compStyle.getPropertyValue(CSSStyleProp);
	}
}

function getPosition(that) {
	var targetEle = that;//thatは位置を取得したい要素Object
	var pos = new function(){ this.x = 0; this.y = 0; }
		while( targetEle ){
		pos.x += targetEle.offsetLeft; 
		pos.y += targetEle.offsetTop; 
		targetEle = targetEle.offsetParent;
		//IEの補正：上記計算で無視されてしまう各親要素のborder幅を加算
		if ((targetEle) && (is_ie)) {
		pos.x += (parseInt(getElementStyle(targetEle,"borderLeftWidth","border-left-width")) || 0);
		pos.y += (parseInt(getElementStyle(targetEle,"borderTopWidth","border-top-width")) || 0);
		}
	}
	//geckoの補正：カウントしないbody部border幅をマイナスしてしまうので２倍して加算
	if (is_gecko) {
	//以下の部分でbody部を取得し、borderの減算を補正する。
	var bd = document.getElementsByTagName("BODY")[0];//body部を取得
	pos.x += 2*(parseInt(getElementStyle(bd,"borderLeftWidth","border-left-width")) || 0);
	pos.y += 2*(parseInt(getElementStyle(bd,"borderTopWidth","border-top-width")) || 0);
	}
	
	if(pos.x < 160) pos.x = 160;
	
	return pos;
}


function tips(e,width){

	if(document.getElementById('tips_above')){
		var element = document.body;   
		element.removeChild(document.getElementById('tips_above'));   
	}
	var element = document.createElement('div');   
	element.id = "tips_above";   
	
	element.innerHTML = '<span style="float:right; border:1px solid #999999; border-top:1px solid #cccccc; border-left:1px solid #cccccc; padding:0 2px 0 2px; margin:4px;"><a href="javascript:tips_close(this);" style="color:#666666; font-size:9pt; display:block;">&#10005;</a></span><p style="font-weight:bold; color:#666666;"><img src="./img/hint.jpg" style="margin-right:5px;" />'+e.alt+'</p>'
	+'<p style="padding:10px; margin:0;" id="tipsBody"><img src="./img/loading.gif" /> 読み込んでいます...</p>';
	
	zahyou=getPosition(e);
	
	
	var objBody = document.getElementsByTagName("body").item(0);   
	objBody.appendChild(element);   
	document.getElementById('tips_above').style.position="absolute";
	element.style.position = 'absolute';   
	element.style.left = zahyou.x-150+'px';
	
	if((zahyou.y+20)<0){
		element.style.top  = '10px';
	}else{
		element.style.top  = zahyou.y+20+'px';
	}
	if(width==undefined){
		element.style.width='350px';
	}else{
		element.style.width=width;
	}
	element.style.borderTop = "solid 1px #cccccc";
	element.style.borderLeft = "solid 1px #cccccc";
	element.style.borderRight = "solid 2px #999999";
	element.style.borderBottom = "solid 2px #999999";
	element.style.backgroundImage = 'url(./img/mainback.jpg)';  
	
	var title=encodeURIComponent(e.alt);
	
	if(title!=""){
		/* HTTPリクエスト送信（キャッシュ対策） */
		var url = './js/tipsReq.php?title='+title+'&time='+Math.random();
		var oHttp = dom.ajax.httpGetRequest(url, printTextTips);
		/* リクエストに失敗したときの処理 */
		if( ! oHttp) {
			alert('エラー');
		}
	}else{
		alert('エラー');
	}
	
	function printTextTips(oHttp) {
	  
		/* HTTPレスポンスステータスが200(OK)かを評価 */
		if(oHttp.status == 200) {
			/* 受信したデータ */
			text = oHttp.responseText;
			
			/* データを表示 */
			document.getElementById('tipsBody').innerHTML=text;
			
		} else {
			alert('エラー');
		}
	}
}