Описание проблемы анимированного GIF'а и слоёв в Opera 5.
На одном сайте мне необходимо было сделать так, чтобы при наведении «мышкой» на ссылку, один DIV сменялся бы на другой. Задача, вообще-то, тривиальная. Реализация тоже весьма лёгкая.
В самой ссылке пишем onMouseOver="toggle(0, 1)" onMouseOut="toggle(0, 0)"
. Во внешнем JavaScript файле у меня следующее:
/*
written by alexander shurkayev <alshur@ya.ru> | http://htmlcssjs.ru
*/
…
function fnLayerName(nNum){
return sTxt+nNum;
}
var sOn=(bNN4) ? ".visibility="show"" : ".visibility="visible"";
var sOff=(bNN4) ? ".visibility="hide"" : ".visibility="hidden"";
if (bNN4){
layerRef="document.layers['";
styleSwitch="']";
}
if (bIE4){
layerRef="document.all['";
styleSwitch="'].style";
}
if ((bNN5) || (bOpera4)){
layerRef="document.getElementById('";
styleSwitch="').style";
}
function fnSetStyle(sLayerName, sStyle){
eval(layerRef+sLayerName+styleSwitch+sStyle);
}
function toggle(nNum, hs){
if (bBrowser3){
if (hs==0){
document.images[ImgNames[nNum]].src=Imgs[nNum].src;
hide(fnLayerName(nNum));
}
if (hs==1){
document.images[ImgNames[nNum]].src=ImgsOver[nNum].src;
show(fnLayerName(nNum));
}
}
}
function show(sLayerName){
if ((bBrowser4)&&(isLoaded)){
fnSetStyle(sLogoName, sOff);
fnSetStyle(sLayerName, sOn);
}
}
function hide(sLayerName){
if ((bBrowser4)&&(isLoaded)){
fnSetStyle(sLogoName, sOn);
fnSetStyle(sLayerName, sOff);
}
}
Как видно из скрипта, вызываемая функция toggle
вызывает, в свою очередь, функции show
и hide
. Всё замечательно, но загвоздка в том, что один из слоёв содержит рисунок. А точнее, анимированный GIF (<div id="logo" class="logobox"><a href="http://www.easports.com/"><img src="i/animlogo.gif" width="85" height="84" border="0" alt="EA Sports"></a></div>
). Internet Explorer 4+ и Netscape Navigator 4+ замечательно переключают слои. Однако Opera 5.02 не справляется с этой задачей — при наведении «мышкой» на ссылку DIV'ы накладываются друг на друга. Поэтому в начале скрипта у меня находится следующее:
var nBrowserVersion=parseInt(navigator.appVersion);
var sBrowserName=navigator.appName;
var bNN4=(document.layers) ? true : false;
var bIE4=((document.all) && (nBrowserVersion >= 4) && (!window.opera)) ? true : false;
var bNN5=((sBrowserName == "Netscape") && (nBrowserVersion >= 5)) ? true : false;
//var bOpera4=((sBrowserName == "Opera") && (nBrowserVersion >= 4)) ? true : false;
var bOpera4 = false;//If a GIF is animated then it's buggy in Opera5.02 to hide/show a layer with this GIF.
var bBrowser4=((bNN4) || (bIE4) || (bNN5) || (bOpera4)) ? true : false;
var bBrowser3=(nBrowserVersion>2) ? true : false;
А вообще, Opera — хороший браузер. Настоятельно рекомендую.