HTML+CSS+JavaScript

Если у кого есть наработки или просто рабочий скрипт качественного rollover'a для двух картинок (одна активная) c предзагрузкой (preload) активных картинок, поделитесь, пожалуйста :) Не хочу велосипед писать.

dreamweaver

function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

Не, извиняюсь, конечно, но это туфта )) Потому что она работает по принципу изменения src у одного и того же объекта, а в моём понимании нормальный rollover - это предварительно созданные пары объектов, меняющие только свой visibility :) Или я не прав? Дримвейверовская предзагрузка изображений работает не со всеми браузерами гладко и по-этому в некоторых случаях всё равно получается эффект ожидания картинки.

>она работает по принципу изменения src у одного и того же объекта, а в моём понимании нормальный rollover - это предварительно созданные пары объектов, меняющие только свой visibility

У вас одновременно ДВА "понимания".
Одно - верное, второе - ошибочное.

То, что смена SRC - это плохо, тут вы правы. Плохо это потому, что даже если предварительно загрузить over-ные изображения в кеш браузера, то браузер при смене SRC тега, даже имея этот файл в кеше, всё-равно "полезет" на сервер, чтобы проверить заголовок файла (не изменилась ли картинка с момента загрузки в кеш). При плохом качестве соединения это может видимо "тормозить" смену картинок.

А вот про "переключаемые visibility" у объектов - вы ошибаетесь.
Пару объектов необходимо тогда "наложить" друг на друга. Т.е. эти объекты надо будет абсолютно "спозиционировать". А это, в свою очередь, повлечет за собою ДВЕ проблемы:
ПЕРВАЯ ПРОБЛЕМА - необходимость отслеживания изменения размеров окна (если вдруг вёрстка имеет "резиновость"), что, в принципе, реализуемо стандартными средствами (window.onresize), но грузит лишний раз парсер.
ВТОРАЯ ПРОБЛЕМА - необходимость отслеживания возможного браузерного изменения размеров шрифта (или масштаба) страницы, что ВОВСЕ не имеет скриптого события и может быть отслежено только лишь по setInterval'у, что уже будет грузить парсер ПОСТОЯННО.

"Идеальным" ролловером поэтому может быть только набор функций, который создаст в объекте document пару виртуальных объектов IMAGE, кои при наведении/отведении мыши будут заменяться друг на друга методом replace (или replaceChild).

*Внимательно прочтите

Спасибо, предпочел все-таки вариант с абсолютным позиционированием, но решил использовать его не глобально, а локально - при помощи контейнера с position:relative :)