aboutsummaryrefslogtreecommitdiffstats
path: root/vendor/desandro/imagesloaded/sandbox/progress/index.html
diff options
context:
space:
mode:
authorMario <mario@mariovavti.com>2018-11-25 10:09:26 +0100
committerMario <mario@mariovavti.com>2018-11-25 10:09:26 +0100
commitc667572d3eedb0c31b29a4c469b378ccdcee0ba1 (patch)
tree70ec4ee1febc545e49a61d7a9b83c9e2cd955d93 /vendor/desandro/imagesloaded/sandbox/progress/index.html
parentbc9f2922e0e255e97cb607d099f60c8a81c4736f (diff)
downloadvolse-hubzilla-c667572d3eedb0c31b29a4c469b378ccdcee0ba1.tar.gz
volse-hubzilla-c667572d3eedb0c31b29a4c469b378ccdcee0ba1.tar.bz2
volse-hubzilla-c667572d3eedb0c31b29a4c469b378ccdcee0ba1.zip
update imagesloaded to version 4.1.4 via composer
Diffstat (limited to 'vendor/desandro/imagesloaded/sandbox/progress/index.html')
-rw-r--r--vendor/desandro/imagesloaded/sandbox/progress/index.html89
1 files changed, 89 insertions, 0 deletions
diff --git a/vendor/desandro/imagesloaded/sandbox/progress/index.html b/vendor/desandro/imagesloaded/sandbox/progress/index.html
new file mode 100644
index 000000000..b01ce28c5
--- /dev/null
+++ b/vendor/desandro/imagesloaded/sandbox/progress/index.html
@@ -0,0 +1,89 @@
+<!doctype html>
+<html>
+<head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width" />
+
+ <title>progress</title>
+
+ <style>
+ #image-container img {
+ max-height: 140px;
+ }
+
+ li {
+ height: 140px;
+ min-width: 100px;
+ display: block;
+ float: left;
+ list-style: none;
+ margin: 0 5px 5px 0;
+ background-color: black;
+ background-position: center center;
+ background-repeat: no-repeat;
+ }
+
+ li img,
+ #status {
+ -webkit-transition: opacity 0.4s;
+ -moz-transition: opacity 0.4s;
+ -ms-transition: opacity 0.4s;
+ transition: opacity 0.4s;
+ }
+
+ li.is-loading {
+ background-color: black;
+ background-image: url('http://desandro.github.io/imagesloaded/assets/loading.gif');
+ }
+
+ li.is-broken {
+ background-image: url('http://desandro.github.io/imagesloaded/assets/broken.png');
+ background-color: #be3730;
+ width: 120px;
+ }
+
+ li.is-loading img,
+ li.is-broken img {
+ opacity: 0;
+ }
+
+ .buttons { margin-bottom: 1.0em; }
+
+ button {
+ font-size: 18px;
+ padding: 0.4em 0.8em;
+ font-family: sans-serif;
+ }
+
+ #status {
+ opacity: 0;
+ position: fixed;
+ right: 20px;
+ top: 20px;
+ background: hsla( 0, 0%, 0%, 0.8);
+ padding: 20px;
+ border-radius: 10px;
+ z-index: 2; /* over other stuff */
+ }
+ </style>
+
+</head>
+<body>
+
+ <h1>progress</h1>
+
+ <div class="buttons">
+ <button id="add">Add images</button>
+ <button id="reset">Reset</button>
+ </div>
+ <div id="status">
+ <progress max="7" value="0"></progress>
+ </div>
+ <div id="image-container"></div>
+
+<script src="../../bower_components/ev-emitter/ev-emitter.js"></script>
+<script src="../../imagesloaded.js"></script>
+<script src="progress.js"></script>
+
+</body>
+</html>