Я обожаю брать готовые решения в виде заплаток при реализации. Это, как правило, экономит, кучу времени. На этот раз всё случилось аналогично, но времени не сэкономило...
Те кто сталкивался с вебом наверняка знакомы с такой софтиной, как dreamweaver. Её исключительная особенность - автоматическая генерация кода для всяких динамических меню и т.д. Все её функции начинаются с MM_.
Так вот, с самого начала проекта необходимо было реализовать простейшее меню с подсветкой, состоящее из одних картинок. В результате я нашел "готовое решение", сгенерированное вышеупомянутым софтом. В итоге поймал множество глюков и багов (один из которых так и не смог отловить) и всё таки решил черкануть 2 строки на jquery.
А теперь сравним разницу:
javascript
function M_preloadImages() {И, вуаля, jquery:
var d = document;
if (d.images) {
if (!d.M_p)
d.M_p = new Array();
var i, j = d.M_p.length, a = M_preloadImages.arguments;
for (i = 0; i < a.length; i++)
if (a[i].indexOf("#") != 0) {
d.M_p[j] = new Image;
d.M_p[j++].src = a[i];
}
} // if
}
function M_findObj (n, d) {
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 = M_findObj(n, d.layers[i].document);
return x;
}
function M_swapImage() {
var i, j = 0, x, a = M_swapImage.arguments;
document.M_sr = new Array;
for (i = 0; i < (a.length - 2); i += 3)
if ( (x = M_findObj(a[j])) != null) {
document.M_sr[j++] = x;
if (!x.oSrc)
x.oSrc = x.src;
var but_numb = a[0];
if (a[0].length == 11) {
if (but_numb.charAt(a[0].length - 1) != page_id)
x.src = a[i+2];
}
else
x.src = a[i+2];
}
}
var el_name ="";
var el = "";
function selectImage() {
var a = selectImage.arguments;
el_name = $(a[0]).attr('src');
el = a[0];
$(a[0]).attr('src', a[1])
}
function imgRestore() {
$(el).attr('src', el_name)
}
html для элемента:
<a href=""><img src="image_unactive.png"
onMouseOut="imgRestore()"
onMouseOver="selectImage('#item1', 'image_active.png')"
id="item1"/></a>
Скажу одно, жаль что когда начинал делать, ещё не понимал в jquery...
Комментариев нет:
Отправить комментарий