Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.08.2012, 20:53
Люблю js, jquery
Отправить личное сообщение для dadli Посмотреть профиль Найти все сообщения от dadli
 
Регистрация: 23.08.2011
Сообщений: 214

некоректная работа image load в сафари и хроме
здравствуите, есть три изображеня, ширина каждои из них 1400 пх. хочу сделать такое: после загрузки всех изображении, алертит сума ширина всех изображении, написал такои код, но в сафари и хроме, резултат етого кода иногда не коректни, (иногда 1400, иногда 2800, но иногда коректнo: 4200)
не понимаю почему так происходит, можете ви сказать ?


var images = new Array("0.jpg", "1.jpg", "2.jpg");
				
				for (var i = 0; i < images.length; i = i + 1) {
					$("#img_place").append("<img src='" + images[i] + "'>");
				}
				
				
				var loadedImgsCount = 0;
				var imgTotalWidth = 0;
				
				for (var i = 0; i < images.length; i = i + 1) {
					var currImg = new Image();
					currImg.onload = function() {
						loadedImgsCount = loadedImgsCount + 1;
						imgTotalWidth = imgTotalWidth + currImg.width;
					}
					currImg.src = images[i];
				
				}
				
				
				interv = setInterval(function() {
					if (images.length === loadedImgsCount) {
						alert(imgTotalWidth );
						clearInterval(interv);
					}
				}, 500);
Ответить с цитированием
  #2 (permalink)  
Старый 28.08.2012, 21:27
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

<script type="text/javascript">
var images = new Array("0.jpg", "1.jpg", "2.jpg");
var loadedImgsCount=0;
var imgTotalWidth = 0;
				
				for (var i = 0; i < images.length; i = i + 1) {
					$("#img_place").append('<img src="' + images[i] + '" onload="loadCoount++;">');
				}
				
	
				
				interv = setInterval(function() {
					if (images.length === loadedImgsCount) {

						$("#img_place > img").each(function() {
							imgTotalWidth+=$(this).width();
						});

						alert(imgTotalWidth );
						clearInterval(interv);
					}
				}, 120);
</script>
Ответить с цитированием
  #3 (permalink)  
Старый 28.08.2012, 21:57
Люблю js, jquery
Отправить личное сообщение для dadli Посмотреть профиль Найти все сообщения от dadli
 
Регистрация: 23.08.2011
Сообщений: 214

Deff,
мне кожется ви хотели написать не
Цитата:
onload="loadCoount++;");
а
Цитата:
onload="loadedImgsCount++;");

но... разве ето правилно? консол ошибки говорит что loadedImgsCount не определенни

Последний раз редактировалось dadli, 28.08.2012 в 21:59.
Ответить с цитированием
  #4 (permalink)  
Старый 28.08.2012, 22:07
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Тады так:

<script type="text/javascript">
  var images = new Array("0.jpg", "1.jpg", "2.jpg");

  var loadedImgsCount=0;
				function CntLoad() {
					loadedImgsCount++;
				}

				loadedImgsCount
				for (var i = 0; i < images.length; i = i + 1) {
					$("#img_place").append('<img src="' + images[i] + '" onload="CntLoad()">');
				}
				
	
  var imgTotalWidth = 0;
				interv = setInterval(function() {
					if (images.length === loadedImgsCount) {

						$("#img_place > img").each(function() {
							imgTotalWidth+=$(this).width();
						});

						alert(imgTotalWidth );
						clearInterval(interv);
					}
				}, 120);
</script>

Последний раз редактировалось Deff, 28.08.2012 в 22:11.
Ответить с цитированием
  #5 (permalink)  
Старый 28.08.2012, 22:12
Люблю js, jquery
Отправить личное сообщение для dadli Посмотреть профиль Найти все сообщения от dadli
 
Регистрация: 23.08.2011
Сообщений: 214

Deff,
сеичас консол говорит: CntLoad is not defined
Ответить с цитированием
  #6 (permalink)  
Старый 28.08.2012, 22:23
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

dadli,
Ни наю - уменя работает:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Общие вопросы от новичков (40)</title>

<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>


</head>
<body>

<div id="img_place"></div>
<script type="text/javascript">
  var images = new Array("http://s1.uploads.ru/i/AzDL4.jpg", "http://s1.uploads.ru/i/5Xyis.jpg", "http://s1.uploads.ru/i/JHdsf.jpg");

  var loadedImgsCount=0;
				function CntLoad() { 
					loadedImgsCount++;

				}

				loadedImgsCount
				for (var i = 0; i < images.length; i = i + 1) {
					$("#img_place").append('<img src="' + images[i] + '" onload="CntLoad()">');
				}
				
	
  var imgTotalWidth = 0;
				interv = setInterval(function() {
					if (loadedImgsCount == 2*images.length) {

						$("#img_place > img").each(function() {
							imgTotalWidth+=$(this).width();
						});

						alert(loadedImgsCount);
						alert(imgTotalWidth );
						clearInterval(interv);
					}
				}, 120);
</script>

</body>
</html>

Последний раз редактировалось Deff, 28.08.2012 в 23:00.
Ответить с цитированием
  #7 (permalink)  
Старый 28.08.2012, 22:51
Люблю js, jquery
Отправить личное сообщение для dadli Посмотреть профиль Найти все сообщения от dadli
 
Регистрация: 23.08.2011
Сообщений: 214

Deff,
спасибо балшое, и скажите пожалуиста, что в етом
Цитата:
$("#img_place > img")
записе означает знак ">" ?
Ответить с цитированием
  #8 (permalink)  
Старый 28.08.2012, 22:54
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Сообщение от dadli
записе означает знак ">" ?
Что img -относиться к #img_place как прямой дочерний элемент
Ответить с цитированием
  #9 (permalink)  
Старый 28.08.2012, 22:59
Люблю js, jquery
Отправить личное сообщение для dadli Посмотреть профиль Найти все сообщения от dadli
 
Регистрация: 23.08.2011
Сообщений: 214

Deff,
понятно, спасибо вам
Ответить с цитированием
  #10 (permalink)  
Старый 28.08.2012, 22:59
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

dadli,
Ксать cобытие загрузки через jQuery если оно в теге - возникает дважды

Поправил скрипт
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Автоматическая смена картинок через заданное время herotic Элементы интерфейса 45 15.05.2020 16:44
jQuery scrollTop не работает в хроме и в сафари dadli jQuery 2 12.05.2012 14:54
кроссбраузерность в хроме, комодо драгон и сафари apostol roman Общие вопросы Javascript 2 06.03.2011 15:03
JS работает в Опере, Хроме и Сафари, и не работает в IE & Mozilla Aliena Javascript под браузер 5 04.12.2010 08:15
Странная работа в Хроме и Сафари Flake jQuery 1 08.09.2010 10:28