var selects=new Array();

function init_selects() {
// НАСТРОЙКИ--------
var btn="img/dd_arrow.gif"; // здесь сурс картинки со стрелочкой
// здесь IDы областей страницы, внутри которых хотим иметь отдизайненные селекты. если не написать ни одного, то селекты отдизайнятся во всём документе.
var designed_ids=new Array(); //А могло быть new Array();
//------------------

var i=0; var j=0;

var select_cropper = document.createElement("div");
document.body.insertBefore(select_cropper,document.body.firstChild); select_cropper.className="select_main_inner select_croper"; select_cropper.id="quote_div";
if(designed_ids.length!=0)
 for(i=0;i<designed_ids.length;i++) {
  if(document.getElementById(designed_ids[i])) {
   curr_selects=document.getElementById(designed_ids[i]).getElementsByTagName('select');
   for(j=0;j<curr_selects.length;j++) {
  	selects.push(curr_selects[j]);
   }
  }
 }
else selects=document.getElementsByTagName('select');

for(i=0;selects[i];i++){
newselect = document.createElement("div"); newselect.id="select_main_div"+i; newselect.className="select_main_div";
selects[i].parentNode.insertBefore(newselect,selects[i]);
newselect.innerHTML="<table class=\"select_table\" width=\"100%\"><tr><td width=\"100%\"><div id=\"select_main_inner"+i+"\" class=\"select_main_inner\" onclick=\"select_click("+i+",event);\">&nbsp;</div></td><td><img src=\""+btn+"\" class=\"select_button\" onclick=\"select_click("+i+",event);\"/></td></tr></table>";
newoptions = document.createElement("div"); newoptions.id="select_select_div"+i; newoptions.className="select_select_div"; newoptions.zIndex=4;
newselect.parentNode.insertBefore(newoptions,newselect);
newshow = document.createElement("div"); newshow.id="select_div_show"+i; newshow.className="select_div_show";
newoptions.appendChild(newshow); newshow.innerHTML="";
newselect.style.width=selects[i].offsetWidth+"px";
 for(j=0;j<selects[i].childNodes.length;j++) {
  if((selects[i].childNodes[j].nodeType!=3)&&(selects[i].childNodes[j].tagName=="OPTION")){
	if(selects[i].childNodes[j].innerHTML=="") optinner="&nbsp;"; else optinner=selects[i].childNodes[j].innerHTML;
	newshow.innerHTML+="<div id=\"item"+i+"_"+j+"\" class=\"select_option\" onmouseover=\"this.className='select_option_hover';\" onmouseout=\"this.className='select_option';\" onclick=\"click_select("+i+","+j+",event);\">"+optinner+"</div><div id=\"item"+i+"_"+j+"_value\" class=\"select_option_value\">"+selects[i].childNodes[j].value+"</div>\n";
	if(selects[i].childNodes[j].selected) crop_select(i,selects[i].childNodes[j].innerHTML);
   }
 }
selects[i].style.display="none";
}

document.body.onclick=body_click;
window.onresize=hide_all_selects;

}

var vis = 0;
var show_int;
var count = 0;
var count_slow;
var step = 10;
var time_int = 10;
var item_div;
var item_string = new String("");

function hide_all_selects() {
	if(vis==1) for(var i=0;document.getElementById("select_main_div"+i);i++) hide_select(i);
}

function show_select(sid) //показать выпадающий список
{
	var select_div = document.getElementById('select_select_div'+sid);
	var select_div_show = document.getElementById('select_div_show'+sid);
	var main_div = document.getElementById('select_main_div'+sid);
	var main_inner = document.getElementById('select_main_inner'+sid);
	select_div.style.width = main_div.offsetWidth + 'px';
	select_div.style.left = main_div.offsetLeft + 'px';
	select_div.style.top = (main_div.offsetTop + main_div.offsetHeight) + 'px';
	select_div_show.style.top = (select_div.offsetHeight * (-1)) + 'px';
	count = select_div.offsetHeight * (-1);
	count_slow = 15*(-1);
	select_div.style.visibility = 'visible';
	select_div.style.zIndex = '5';
	clearInterval(show_int);
	step=10;
	show_int = setInterval('move_obj('+sid+')', time_int);
}

function move_obj(sid) 
{
	var select_div_show = document.getElementById('select_div_show'+sid);
	count = count + step;
	if (count >= count_slow) step = 1;
	if (count == 0) 
	{
		select_div_show.style.top = count + 'px';
		step = 10;
		clearInterval(show_int);
	}
	select_div_show.style.top = count + 'px';
}

function hide_select(sid) //скрыть выпадающий список
{
	var select_div = document.getElementById('select_select_div'+sid);
			select_div.style.visibility = 'hidden'; 
			select_div.style.left = '0px'; 
			select_div.style.top = '0px'; 
			vis = 0;
	return;
}

function click_select(sid,x,evt) //обработка клика по пункту списка (номер селекта, номер пункта)
{
	evt.stopPropagation ? evt.stopPropagation() : evt.cancelBubble = true;
	var select_div = document.getElementById('select_select_div'+sid);
	var select_div_show = document.getElementById('select_div_show'+sid);
	hide_select(sid);
	select_div.style.left = '0px'; 
	select_div.style.top = '0px'; 
	item_div = document.getElementById('item'+sid+'_'+x);
	selects[sid].value=document.getElementById("item"+sid+"_"+x+"_value").innerHTML;
	crop_select(sid,item_div.innerHTML);
	
}

function crop_select(sid,item_string) //обрезание строки и помещение в селект (номер селекта, строка)
{
	var main_inner = document.getElementById('select_main_inner'+sid);
	var quote_div = document.getElementById('quote_div');
	var main_div = document.getElementById('select_main_div'+sid);
	quote_div.innerHTML = item_string;
	if(quote_div.offsetWidth >= main_inner.offsetWidth)
	{
		quote_div.innerHTML = item_string+"...";
		var err = item_string.length;
			while (quote_div.offsetWidth > main_inner.offsetWidth)
			{
				err --;
				quote_div.innerHTML = item_string.substring(0, err)+"...";
			}
			main_inner.innerHTML = quote_div.innerHTML;
	}
	else main_inner.innerHTML = item_string;
}

function select_click(sid,evt) //обработка клика по селекту
{
	evt.stopPropagation ? evt.stopPropagation() : evt.cancelBubble = true;
	if(vis==0) { show_select(sid); vis=1; }
	else { hide_all_selects(); }
}

function body_click() {
	if(vis==1) hide_all_selects();
}