var m_es_max	= 26;	//	スタイルの最大数
var m_es_imgurl	= "http://www.getamped2.jp/images/data/";	//イメージの元URL

var m_es_es_css	= {
	'text-align'		:'center',
	'font-size'			:'12px',
	'background-color'	:'#ffe',
	'border'			:'1px solid #000',
	'position'			:'absolute',
	'width'				:'490px',
	'display'			:'none'
}
var m_es_div_css = {
	'margin'			:'0',
	'padding'			:'2px'
}
var m_es_esul_css = {
	'text-align'		:'left',
	'margin'			:'0 0',
	'padding'			:'4px 0 0 4px',
	'list-style'		:'none'
}
var m_es_esli_css = {
	'margin'			:'0 3px 0 0',
	'padding'			:'0',
	'display'			:'inline'
}
var m_es_img_css = {
	'height'			:'32px',
	'width'				:'75px',
	'border'			:'1px solid #000'
}
var m_es_ie7_esli_css = {
	'margin'			:'0 3px 0 0',
	'padding'			:'0',
	'display'			:'inline'
}
var m_es_ie7_img_css = {
	'margin'			:'1px',
	'height'			:'30px',
	'width'				:'73px',
	'border'			:'1px solid #000'
}


$.equipstyle = function (){
	if($('div#es_box') != null){
		$.es_setimage = function(num, flg){
			return m_es_imgurl + 'style_' + num + '_' + flg + '.png';
		}
		es = $('div#es_box');
		es.css(m_es_es_css);
		var html = "";
		html += '<div>';
		html += '装備可能スタイル';
		html += '<ul>';
		for(i = 0; i < m_es_max; i++){
			html += '<li>';
			html += '<img src="' + $.es_setimage(i, 'x') + '" name="' + i + '" />';
			html += '</li>';
		}
		html += '</ul>';
		html += '</div>';
		
		es.html(html);
		
		esdiv = es.find('div');
		esdiv.css(m_es_div_css);
		es.find('ul').css(m_es_esul_css);
		if('\v'=='v' && typeof document.documentElement.style.msInterpolationMode != "undefined"){
			es.find('li').css(m_es_ie7_esli_css);
			es.find('img').css(m_es_ie7_img_css);
		}else{
			es.find('li').css(m_es_esli_css);
			es.find('img').css(m_es_img_css);
		}
		
		esobj = $('.equipstyle');
		esobj.hover(
			function () {
				if(!this.alt.length){
					return;
				}
				
				var aralt = this.alt.split(',');
				
				es = $('div#es_box');
				esimg = es.find('img');
				esimg.each( function (){
					this.src = $.es_setimage(this.name, 'x');
					for(i = 0; i < aralt.length; i++){
						if(aralt[i] == this.name){
							//alert(this.name);
							this.src = $.es_setimage(this.name, 'o');
						}
					};
				});
				
				es.css({
					'left':($(this).position().left + 2                   ) + 'px',
					'top' :($(this).position().top  + $(this).height() + 2) + 'px',
					'display':'block'
				});
			},
			function () {
				$('div#es_box').css({
					'display':'none'
				});
			}
		);
	}
}