Показать сообщение отдельно
  #3 (permalink)  
Старый 28.07.2014, 16:44
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

callback после загрузки всех фото
KlausKater,

<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .gallery img{
    width: 150px;
    height: 100px;
  }

  </style>
  <script>
  	window.onload = function () {
  	  var imgs = document.querySelectorAll('.gallery img');
  	  var arr_src =['http://www.anypics.ru/pic/201302/1366x768/anypics.ru-59453.jpg',
  	    'http://www.wall-papers.ru/main.php?g2_view=core.DownloadItem&g2_itemId=38417&g2_serialNumber=3',
  	    'http://w7t.ru/zooms/7da1/7/6168262b44.jpg',
  	    'http://imgs.mi9.com/uploads/cartoon/4834/disney-cartoon-wallpaper_1366x768_88837.jpg',
  	    'http://biskvitka.net/uploads/posts/2011-05/thumbs/1306582219_12.jpg'];
  	  var callback = function ()
  	  {
  	    alert('complete')
  	  };
  	  for (var i = 0, len = imgs.length; i < imgs.length; i++) {
  	    var img = document.createElement('img');
  	    img.onload = img.onerror = (function (a)
  	      {
  	        return function (event) {
  	          imgs[a].src = event && event.type == 'load'? this.src: 'data:image/jpg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD\
              /2wCEAAkGBxQRERMQEhQQFBIQEBATEBcUFhsQFBERFx0WFhQVGBQYHyggGBolHRMUITEhJSkrLi4uFx8zODMsNygtLisBCgoKBQUFDgUF\
              DisZExkrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrK//AABEIAIgAtAMBIgACEQEDEQH/xAAaAA\
              EBAQEBAQEAAAAAAAAAAAAABAMBAgUH/8QANBAAAgEBBQYGAgECBwAAAAAAAAECEQMEElFhEyExMkGRFCJygYLRccGxUqEFM2KSwuHw/8QA\
              FAEBAAAAAAAAAAAAAAAAAAAAAP/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AP2+cqcOrpkcrLKPd/QtOnqRnbzae7IDSs\
              so939Csso939E21eY2rzAprLKPd/QrLKPd/RNtXmNq8wKayyj3f0Kyyj3f0TbV5javMCmsso939Csso939E21eY2rzAprLKPd/QrLKPd/R\
              NtXmNq8wKayyj3f0Kyyj3f0TbV5javMCmsso939Csso939E21eY2rzAprLKPd/QrLKPd/RNtXmNq8wKayyj3f0Kyyj3f0TbV5javMCmsso\
              939HJTa6Liuv8A0T7V5lE+VfH+UBoAAPFp09SMbzx9ja06epGN54+wGQAAAAAAAABwDoOADoOHQAAAAAAAABTLlXx/RMUy5V8f0BqAAPFp\
              09SMbzx9ja06epGN54+wGQAAAHmcqKuQHoEviHoPEPQD3eZ9CYzvF6o3ucmlV04L8vocsrwnRNOLkt1eD/DA1B3rRtJ5NpPsJpR3NxT1aQ\
              HD1GVHU8OaSq3Gmdd3c6nXeqNabwL0zpJC2aVNx3xD0AqBjZW1XRmwAAACmXKvj+iYplyr4/oDUAAeLTp6kY3nj7G1p09SMbzx9gMgAAM7\
              blZoZ2/KwJAABHN4domn56uLSquHB04G9kk42aVfK4uUqUUadFmV3aHF+x4tZ1dOi4ASRvEVGalTFilirxf9NP7HbS1ezhiSrWzrmbNLjR\
              VDA7OcXaRxUSwvDXhir/JlZQpK0ceRyVMq030NGVQ80af+qBKdAA0u/MvcrJLvzL3KwAAAFMuVfH9ExTLlXx/QGoAA8WnT1IxvPH2NrTp6\
              kY3nj7AZAAAT3+1wwbonvit+7iygl/xGycrNpU4xe/dwYEe2abi0qqDkqOq/DyPKvEsONxWGlXv81M6HnYNYpUjFbOSaTriOWcJuzUfLRx\
              SrXfhemYF0Ld0wwSbSxOrot/BfkknfElGVOaTT/wBNOJtZ3be2lGSolSTpSm6pjaXPli8O5ycqblvTW4D3aW6U4w/qrXRdP4PHiXRzUU4K\
              vWkmlxaR4srrJOMpNNqTxemmFHFdGlhpZvjST401WYFKtliw7qYVJOvGp7u168tacbTBx/O/+xirusdWotYIxX5WhrY3RqzSdP8ANxvLDv\
              A5aWyxyXRRcq+5l4h0U3FKLp18yT4No67usUnRKMoU3bt9cjy7GTioPDRUq097S06AW2HN3KySw5u5WAAAAplyr4/omKZcq+P6A1AAHi06\
              epGN54+xtadPUjG88fYDIAADO35Wepyom8k2fPtsSstriliopUr5eK3UA9NBKm5dCe1j54eaaUsTaxNdKnaOU3HFJKCjwdG2+rYFVnOjqU\
              TgpKqPmYnFxrLFGrhL/jXU9XeTkpSrJJyeGjapFbugFMoNdDyomFneWrJSrLFKiq3iSq6VoylPC15ptNNNSe9vNZAaWVh1Z28WnRe5HCTd\
              pJYp0jgp5m+OZFG1eFOtpix8W3gpWm/pwA+kCSds4441bkmsH4lw7C0m8Sg3OkYJvDxk9WBfd+Ze5WfKu1ZJ1c0446OuFtU3VoW3KPkjJu\
              Tcoxbq2+1QKAAAKZcq+P6JimXKvj+gNQAB4tOnqRjeePsbWnT1IxvPH2AyAAAmlc40p5sNa4a+Wv4KTjAnldk2pb6xrT3PNpc4t18ydKVT\
              pVFNBQCC83VKGzjGTxcNHWrbZRC7pJLJUN6HaASq5xw4KNqmfucs7nFOtZNpUVXWn4K6CgE8bslJy31dK78jFf4fGlKzw1rSu7MuocoBBK\
              7KVqnhaUE976vpQ2tLpFuvmTW6qdHTIpoKAY2N2jFUVd9a1dW68Wa2cMKUVwSSR6SOgAAAKZcq+P6JimXKvj+gNQAB4tOnqRjeePsbWnT1\
              I8Wtk2+nACcGvh3oPDvQDIGvh3oPDvQDIGvh3oPDvQDIGvh3oPDvQDIGvh3oPDvQDIGvh3oPDvQDIGvh3oPDvQDIGvh3oPDvQDIGvh3oPD\
              vQDIplyr4/oz8O9DWa8v8At/lAaAADzKNTmz1l3AAbPWXcbPWXcABs9Zdxs9ZdwAGz1l3Gz1l3AAbPWXcbPWXcABs9Zdxs9ZdwAGz1l3Gz\
              1l3AAbPWXcbPWXcABs9Zdxs9ZdwAGz1l3Gz1l3AAbPWXc47PV9wANAAB/9k='; //ссылка на фото отстутствует
  	        }
  	      }
  	    )(i);
  	    imgs[i].onload = function ()
  	    {
  	      !--len && callback()
  	    };
  	    //img.src = arr_src[i];  убрать коментарий и строку ниже
  	    img.src = Math.random() > .7? '1.jpg': arr_src[i]; //тест на ошибку загрузки
  	    img.complete && img.onload()
  	  }
  	}
  </script>
</head>

<body>
<div class="gallery">
<img src="http://pampinta.com/imgs/img_loader.gif" alt=""  />
<img src="http://pampinta.com/imgs/img_loader.gif" alt="" />
<img src="http://pampinta.com/imgs/img_loader.gif" alt="" />
<img src="http://pampinta.com/imgs/img_loader.gif" alt="" />
<img src="http://pampinta.com/imgs/img_loader.gif" alt="" />
</div>
</body>
</html>

Последний раз редактировалось рони, 28.07.2014 в 23:38.
Ответить с цитированием