Тема: JS Скрипт не работает если контейнер TD
Во всех нормальных браузерах работает, но они меня не интересуют, потом это будет HTA.
Не работает в ИЕ и только если контейнером служит таблица. XP SP2 IE6 и XP SP3 IE8.
Вот готовый файл, кому не лень посмотрите, что происходит с верхней кнопкой.
Вариант с картинками предлагать не нужно.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<title>Кто не дружит с головой</title>
<meta http-equiv="Content-Type" content="text/html; charset=Windows-1251">
<style type="text/css"><!--
.R0, .R1, .R2, .R3, .R4, .R5, .R6, .R7, .U2, .U3, .U4, .U5, .U6, .U7 {border-style:solid; overflow:hidden; height:1px; border-color:blue;}
.R0, .R1 {margin:0 6px;}
.R2, .R3, .U2, .U3 {margin:0 5px;}
.R4, .U4 {margin:0 4px;}
.R5, .U5 {margin:0 2px;}
.R0, .R1 {background:green;}
.R2, .R3, .R4, .R5, .R6, .R7, .R8 {background:gainsboro;}
.U2, .U3, .U4, .U5, .U6, .U7, .U8 {background:bisque;}
.R0, .R1, .R3, .R8, .U3, .U8 {border-width:0 2px 0 2px;}
.R2, .R4, .R7, .U2, .U4, .U7 {border-width:0 3px 0 3px;}
.R5, .U5 {border-width:0 4px 0 4px;}
.R6, .U6 {border-width:0 5px 0 5px;}
.R8, .U8 {color:#800000; font:italic 600 100% "Courier New", Monospace; border-color:green; border-style:solid; text-align:center;}
.curP {cursor:pointer; margin:0 5px;}
--></style>
<script type="text/javascript"><!--
function mousOver(){
var obj, l=2, i=7;
obj=this.getElementsByTagName("div")
while(l!=9){obj[l].className='U'+l; l++;};
while(l!=15){obj[l].className='U'+i; i--; l++;};
};//
//
onload=function(){
var obj, el, el1, l, i, s;
obj=document.getElementsByTagName("div");
l=obj.length;
while(l--){
if(obj[l].className.indexOf("R8")==0){
el=obj[l].parentNode;
s=el.innerHTML;
el.innerHTML="";
el=el.appendChild(document.createElement("div"));
el.className="curP";
el.onmouseover=mousOver;
i=0;
while(i!=8){el.appendChild(document.createElement("div")).className='R'+i; i++;};
el.innerHTML+=s;
while(i--){el.appendChild(document.createElement("div")).className='R'+i;}}};
};//
--></script>
</head>
<body>
<br><br><br>
<table border="0" width="100%" cellpadding="0" cellspacing="0"><tr><td>
<div><div class="R8">Ввод</div></div>
</td></tr></table>
<br>
<div><div class="R8">Ввод</div></div>
<br>
<div><div class="R8">Ввод</div></div>
</body>
</html>
