LB_Shelter_Draw();

function LB_Shelter_Draw() {
	//全体の入れ物
	document.write("<div id='LB_Container'></div>");
	var LB_Container = document.getElementById("LB_Container");
	LB_Container.style.position = "relative";
	LB_Container.style.width = "200px";
	LB_Container.style.height = "125px";
	LB_Container.style.background = "url(http://www.lifeboatjapan.org/cooperation/blogparts/res/shelter-iten-bg.png) no-repeat";
	LB_Container.style.textAlign = "left";
	LB_Container.onmouseover = function(){ LB_SetVisibility("LB_UI", "visible") };
	LB_Container.onmouseout = function(){ LB_SetVisibility("LB_UI", "hidden") };

	//UI全体
	var LB_UI = document.createElement("div");
	LB_UI.id = "LB_UI";
	LB_UI.style.visibility = "hidden";
	LB_Container.appendChild(LB_UI);
	
	//メッセージ
	var LB_Display = document.createElement("div");
	LB_Display.id = "LB_DISPLAY";
	LB_Display.style.position = "absolute";
	LB_Display.innerHTML = "<img src='http://www.lifeboatjapan.org/cooperation/blogparts/res/shelter-iten-display.png' />";
	LB_UI.appendChild(LB_Display);
	
	//メニュー１
	var LB_Menu1 = document.createElement("div");
	LB_Menu1.id = "LB_MENU1";
	LB_Menu1.className = "lb_menu";
	LB_Menu1.style.position = "absolute";
	LB_Menu1.style.left = "47px";
	LB_Menu1.style.top = "60px";
	LB_Menu1.innerHTML = "<a href='http://www.lifeboatjapan.org/cooperation/shien-shelter-index.htm?blogparts'><img src='http://www.lifeboatjapan.org/cooperation/blogparts/res/shelter-iten-menu1.png' /></a>";
	LB_UI.appendChild(LB_Menu1);
	//メニュー２
	var LB_Menu2 = document.createElement("div");
	LB_Menu2.id = "LB_MENU2";
	LB_Menu2.className = "lb_menu";
	LB_Menu2.style.position = "absolute";
	LB_Menu2.style.left = "47px";
	LB_Menu2.style.top = "90px";
	LB_Menu2.innerHTML = "<a href=\"javascript:void(0)\" onclick=\"LB_SetVisibility('LB_IMG1', 'visible')\"><img src=\"http://www.lifeboatjapan.org/cooperation/blogparts/res/shelter-iten-menu2.png\" /></a>";
	LB_UI.appendChild(LB_Menu2);
	
	//拡大イメージ
	var LB_Img1 = document.createElement("div");
	LB_Img1.id = "LB_IMG1";
	LB_Img1.style.position = "absolute";
	LB_Img1.style.width = "400px";
	LB_Img1.style.height = "250px";
	LB_Img1.style.fontSize = "small";
	LB_Img1.style.border = "1px solid #888";
	LB_Img1.style.visibility = "hidden";
	LB_Img1.style.background = "url(http://www.lifeboatjapan.org/cooperation/blogparts/res/shelter-iten-img1.png) no-repeat";
	LB_Img1.style.zIndex = "100";
	LB_Img1.onclick = function(){ LB_SetVisibility('LB_IMG1', "hidden") };
	LB_Img1.innerHTML = "<img src='http://www.lifeboatjapan.org/cooperation/blogparts/res/shelter-iten-close.png' />";
	LB_UI.appendChild(LB_Img1);
	var br = document.body.getBoundingClientRect().right;
	var ir = LB_Img1.getBoundingClientRect().left + 400 + 2;
	if (ir > br) {
		LB_Img1.style.left = (br-ir).toString() + "px";
	}
}

function LB_SetVisibility(id, flag) {
	var element = document.getElementById(id);
	element.style.visibility = flag;
}