Печально, но всплыла другая проблема: при наведении на любой из первых трех элементов - JS расценивает как наведение на элемент 4. При наведении на 4 элемент не происходит ничего. Код:
// JavaScript Document
var imgArr = ["url('./img/pic_0.png')","url('./img/pic_1.png')","url('./img/pic_2.png')","url('./img/pic_3.png')","url('./img/pic_4.png')"];
var background = "url('./img/podlojka.png')";
var background_empty = "url('./img/podlojka_empty.png')";
function Wallpaper() {
for (var i=1; i<4; i++) {
var element = document.getElementById('price'+i);
element.onmouseover = function() {
ShowBackElement(i);
}
element.onmouseout = function() {
HideBackElement(i);
}
}
}
function ShowBackElement(i) {
var backgr = document.getElementById('price'+i);
backgr.style.backgroundImage = background;
var red = document.getElementById('under_price'+i);
red.style.color = '#430606';
var yellow = document.getElementById('old_price'+i);
yellow.style.color = '#ffc601';
var backImg = document.getElementById('wallpaper');
backImg.style.backgroundImage = imgArr[i-1];
}
function HideBackElement(i) {
var backgr = document.getElementById('price'+i);
backgr.style.backgroundImage = background_empty;
var red = document.getElementById('under_price'+i);
red.style.color = '#cd5d5d';
var yellow = document.getElementById('old_price'+i);
yellow.style.color = '#ff8d06';
var backImg = document.getElementById('wallpaper');
backImg.style.backgroundImage = imgArr[0];
}