up

2019-03-26 23:16:23 +03:00 · 2019-03-26 23:16:23 +03:00 · 0873d43d72
commit 0873d43d72
parent 706b1f26b2
62 changed files with 1695 additions and 142 deletions
--- a/2-ui/10-loading/03-onload-onerror/1-load-img-callback/source.view/index.html
+++ b/2-ui/10-loading/03-onload-onerror/1-load-img-callback/source.view/index.html
@ -0,0 +1,43 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+</head>
+<body>
+
+  <script>
+    function preloadImages(sources, callback) {
+      /* your code */
+    }
+
+    // ---------- The test ----------
+
+    let sources = [
+      "https://en.js.cx/images-load/1.jpg",
+      "https://en.js.cx/images-load/2.jpg",
+      "https://en.js.cx/images-load/3.jpg"
+    ];
+
+    // add random characters to prevent browser caching
+    for (let i = 0; i < sources.length; i++) {
+      sources[i] += '?' + Math.random();
+    }
+
+    // for each image,
+    // let's create another img with the same src and check that we have its width immediately
+    function testLoaded() {
+      let widthSum = 0;
+      for (let i = 0; i < sources.length; i++) {
+        let img = document.createElement('img');
+        img.src = sources[i];
+        widthSum += img.width;
+      }
+      alert(widthSum);
+    }
+
+    // every image is 100x100, the total width should be 300
+    preloadImages(sources, testLoaded);
+  </script>
+
+</body>
+</html>