потестил ваш код. проблема в том, что изначально скрипт делает менюшку на 2px больше оригинального изображения из папки img и только после клика на нем делает размер оригинальным.
решение данной проблемы нашел такое :
для начала надо переставить строки кода
CODE:var icount = 4; // image count
var iw = 49; // start width
var iw2 = 90; // end width
var ih = 74; // start height
var ih2 = 135; // end height
чтоб выглядели они так:
CODE:var icount = 4; // image count
var iw = 49; // start width
var ih = 74; // start height
var iw2 = 90; // end width
var ih2 = 135; // end height
чтоб хотя бы для себя не было путаницы между начальным и конечным размерами ячеек меню.
далее, в самой строке меню надо добавить атрибут height и прописать размер ячейки меньше, чем те, которые указаны в параметрах var iw и var ih . и меньше это должно быть именно на 2px. Т.е. если у вас размеры 49х74, то строчка одной ячейки меню должна выглядеть так:
CODE:<img id="i1" src="img/ajax.png" alt="ajax" onmouseover="stop=1; imn=1; g();" width="47" height="72">
вот собственно, если по такому алгоритму создавать меню, то оно будет работать как вы хотите.
вот такой код был у меня на пробной страничке :
Разверни (Отобразить)CODE:<html>
<head>
<SCRIPT language=JavaScript>
var imn;
var icount = 4; // image count
var iw = 88; // start width
var ih = 88; // start height
var iw2 = 135; // end width
var ih2 = 135; // end height
var stop;
function g() {
for(i=1;i<=icount;i++) {
var im = document.getElementById("i"+i);
if(imn!=i) {
im.width=(im.width>=iw)?(im.width-2):im.width;
im.height=(im.height>=ih)?(im.height-2):im.height;
}
else {
im.width=(im.width<=iw2)?(im.width+2):im.width;
im.height=(im.height<=ih2)?(im.height+2):im.height;
}
}
if(stop<iw2-iw || stop<ih2-ih) {setTimeout("g()", 20); stop++;}
}
</SCRIPT>
</head>
<body>
<span onmouseout="stop=1; imn=0; g();">
<img id="i1" src="img/internet.gif" alt="internet" onmouseover="stop=1; imn=1; g();" width="86" height="86">
<img id="i2" src="img/bugs.gif" alt="bugs" onmouseover="stop=1; imn=2; g();" width="86" height="86"">
<img id="i3" src="img/mp3.gif" alt="mp3" onmouseover="stop=1; imn=3; g();" width="86" height="86">
<img id="i4" src="img/php.gif" alt="php" onmouseover="stop=1; imn=4; g();" width="86" height="86">
</span>
</body>
</html>
при таком правиле создания менюшки все работает прекрасно. как доказательство - прикрепляю скриншот. если идти сверху вниз - меню до клика мышки, при клике мышкой и после клика. как видите, до клика и после менюшка абсолютно одинаковая. |