есть код
| Код |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>имитация select</title>
<style type="text/css">
/*<![CDATA[*/
html,body{}
.selDiv{position:relative;margin:0px;padding:0px;}
.selDiv span a{display:block;width:100%;text-align:center}
.selDiv span a:hover{background-color:red}
.selDiv #fallElem{margin:0px;padding:0px;display:none;border-color:gray;border-style:solid;border-width:1px;width:200px;overflow:auto;overflow-x:hidden;height:150px;background-color:#eee;position:absolute;top:0px;left:0px;z-index:10}
.setElem{margin:0px;padding:0px;border-color:black;border-style:solid;border-width:1px;background-color:#eee;width:100%;height:100%}
/*]]>*/
</style>
<script type="text/javascript">
//<![CDATA[
fallFunc=function(prm1,prm2){document.getElementById(prm1).style.display=prm2;}
setFunc=function(e,prm1)
{
e=e||window.event;
i=e.target||window.event.srcElement;
//alert(i.offsetHeight)// 9 опера траблы.. Version 9.00; Build 8502
hndl=i.parentNode.getElementsByTagName('SPAN');
hndl[1].style.top=i.offsetHeight-1+'px';
hndl[1].style.display=prm1;
}
stVl=function(e,prm1)
{
e=e||window.event;i=e.target||window.event.srcElement;
hndl=i.parentNode.parentNode.getElementsByTagName('SPAN');
hndl[0].innerHTML=i.innerHTML;
hndl[0].title=prm1;
document.getElementById('fallElem').style.display='';
}
//]]>
</script>
</head>
<body>
yuiyyyyyyyuihuihuihhui
<span class="selDiv">
<span class="setElem" title="none" onmouseover="setFunc(event,'block')" onmouseout="setFunc(event,'')">Выберите...</span>
<span id="fallElem" onmouseover="fallFunc(this.id,'block')" onmouseout="fallFunc(this.id,'none')">
<a href="#" onclick="stVl(event,this.rel)" rel="http://111111111111112">1111111111112</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya1.ru">21</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya2.ru">22</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya3.ru">23</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya4.ru">24</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya5.ru">25</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya6.ru">26</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya7.ru">27</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://111111111111112">1111111111112</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya1.ru">21</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya2.ru">22</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya3.ru">23</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya4.ru">24</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya5.ru">25</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya6.ru">26</a>
<a href="#" onclick="stVl(event,this.rel)" rel="http://ya7.ru">27</a>
</span>
</span>
</body>
</html>
|
который замечательно работает и в осле и в лисенке, в опере 9 возникают непонятки, или я чего-то забыл
1 как добраться до alert(i.offsetHeight)
2 артефакты прорисовки, из-за чего они.
З.Ы. другое решение не предлагать, хочу разобраться с этим |
