Показать сообщение отдельно
  #1 (permalink)  
Старый 20.07.2011, 12:39
Аватар для Ankh
Новичок на форуме
Отправить личное сообщение для Ankh Посмотреть профиль Найти все сообщения от Ankh
 
Регистрация: 20.07.2011
Сообщений: 9

... и все же, как прогнать в цикле?
Доброе время суток. Совсем недавно взялся за изучение JS, и вчера имел честь написать свой первый скрипт. Все, чудесно, все работает, но длина: 100 строк. Можно ли укоротить этот кошмар шедевр путем использования цикла? Или иные варианты сделать код короче. Заранее спасибо!
// JavaScript Document
var imgArr = ["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() {
	var element1 = document.getElementById('price1');
	element1.onmouseover = ShowBackElement1;
	element1.onmouseout = HideBackElement1;
	var element2 = document.getElementById('price2');
	element2.onmouseover = ShowBackElement2;
	element2.onmouseout = HideBackElement2;
	var element3 = document.getElementById('price3');
	element3.onmouseover = ShowBackElement3;
	element3.onmouseout = HideBackElement3;
	var element4 = document.getElementById('price4');
	element4.onmouseover = ShowBackElement4;
	element4.onmouseout = HideBackElement4;
}

function ShowBackElement1() {
	var backgroung = document.getElementById('price1');
	backgroung.style.backgroundImage = background;
	var red = document.getElementById('under_price1');
	red.style.color = '#430606';
	var yellow = document.getElementById('old_price1');
	yellow.style.color = '#ffc601';
	var backImg = document.getElementById('wallpaper');
	backImg.style.backgroundImage = imgArr[0];
}
function HideBackElement1() {
	var backgroung = document.getElementById('price1');
	backgroung.style.backgroundImage = background_empty;
	var red = document.getElementById('under_price1');
	red.style.color = '#cd5d5d';
	var yellow = document.getElementById('old_price1');
	yellow.style.color = '#ff8d06';
	var backImg = document.getElementById('wallpaper');
	backImg.style.backgroundImage = imgArr[0];
}
function ShowBackElement2() {
	var backgroung = document.getElementById('price2');
	backgroung.style.backgroundImage = background;
	var red = document.getElementById('under_price2');
	red.style.color = '#430606';
	var yellow = document.getElementById('old_price2');
	yellow.style.color = '#ffc601';
	var backImg = document.getElementById('wallpaper');
	backImg.style.backgroundImage = imgArr[1];
}
function HideBackElement2() {
	var backgroung = document.getElementById('price2');
	backgroung.style.backgroundImage = background_empty;
	var red = document.getElementById('under_price2');
	red.style.color = '#cd5d5d';
	var yellow = document.getElementById('old_price2');
	yellow.style.color = '#ff8d06';
	var backImg = document.getElementById('wallpaper');
	backImg.style.backgroundImage = imgArr[0];
}
function ShowBackElement3() {
	var backgroung = document.getElementById('price3');
	backgroung.style.backgroundImage = background;
	var red = document.getElementById('under_price3');
	red.style.color = '#430606';
	var yellow = document.getElementById('old_price3');
	yellow.style.color = '#ffc601';
	var backImg = document.getElementById('wallpaper');
	backImg.style.backgroundImage = imgArr[2];
}
function HideBackElement3() {
	var backgroung = document.getElementById('price3');
	backgroung.style.backgroundImage = background_empty;
	var red = document.getElementById('under_price3');
	red.style.color = '#cd5d5d';
	var yellow = document.getElementById('old_price3');
	yellow.style.color = '#ff8d06';
	var backImg = document.getElementById('wallpaper');
	backImg.style.backgroundImage = imgArr[0];
}
function ShowBackElement4() {
	var backgroung = document.getElementById('price4');
	backgroung.style.backgroundImage = background;
	var red = document.getElementById('under_price4');
	red.style.color = '#430606';
	var yellow = document.getElementById('old_price4');
	yellow.style.color = '#ffc601';
	var backImg = document.getElementById('wallpaper');
	backImg.style.backgroundImage = imgArr[3];
}
function HideBackElement4() {
	var backgroung = document.getElementById('price4');
	backgroung.style.backgroundImage = background_empty;
	var red = document.getElementById('under_price4');
	red.style.color = '#cd5d5d';
	var yellow = document.getElementById('old_price4');
	yellow.style.color = '#ff8d06';
	var backImg = document.getElementById('wallpaper');
	backImg.style.backgroundImage = imgArr[0];
}


В HTML:
<script type="text/javascript" src="js/wallpaper.js"></script>
<script type="text/javascript">
	window.onload = function() {
		Wallpaper();
	}
</script>
Ответить с цитированием