Показать сообщение отдельно
  #1 (permalink)  
Старый 17.03.2013, 20:29
Интересующийся
Отправить личное сообщение для bakmaks Посмотреть профиль Найти все сообщения от bakmaks
 
Регистрация: 17.03.2013
Сообщений: 10

Проблема с выводом изображений из массива
Есть некоторое кол-во изображений, приблизительно 400 на 600 px, но размер точный их заранее не известен. Надо в одном div разместить маленькие превьюшки, при клике на которые , в другом div будет выводится изображение картинки на которой кликнули в натуральную величину.
function getImages()
	{		
		var I = [];		
		for ( var i = 0; i < 10; i++ )
		{
			var myImage = new Image();
			myImage.src = "../img/pict" + (i+1) + ".jpg";
			myImage.ind = i+1;
			I.push(myImage);
		}
		return I;
	}
	function onPhotoClick()
	{
		var photo = document.getElementById("photo");
		photo.src = "../img/pict" + this.ind + ".jpg";  
	}
	window.onload = function()
	{
		var phContainer = document.getElementById('photoContainer');
		var Images  = getImages();
		for (var i =0; i < 10; i++)
		{ 
			var newImg = document.createElement('newImg')
			newImg = Images[i];
			newImg.width = Images[i].width / 5;
			newImg.height = Images[i].height / 5;
			phContainer.appendChild(newImg);
			newImg.onclick = onPhotoClick;			
		}
	}

<body>
<h1 align = "center"> Фотоальбом </h1>
<div align = "center" id = "photoContainer">
</div><br/>
<div align = "center">
<img src = "../img/pict1.jpg" id = "photo">
</div>
</body>
В Firefox и Chrome при первом запуске выводится маленькая картинка фотографии с номером один ну и соответственно в реальном размере в другом div. И на этом все заканчивается. Если страницу перезагрузить , то все начинает работать. В IE наоборот , с начала работает, но криво, превьюшки не все создает. А если перезагрузить страницу , то выводится маленькая картинка первой фотки и ее большая копия и все дальше никаких реакций. Помогите разобраться. Javascript еще только осваиваю .
Ответить с цитированием