From 332e98a42fcb79985da024437e9c80a593fe436b Mon Sep 17 00:00:00 2001 From: Alexis Tacnet Date: Tue, 7 Feb 2017 00:28:08 +0100 Subject: [PATCH] Add progressive js --- layouts/partials/footer_scripts.html | 5 +++++ layouts/partials/head_includes.html | 2 ++ static/css/progressively.min.css | 1 + static/js/progressively.min.js | 7 +++++++ 4 files changed, 15 insertions(+) create mode 100644 static/css/progressively.min.css create mode 100644 static/js/progressively.min.js diff --git a/layouts/partials/footer_scripts.html b/layouts/partials/footer_scripts.html index bbe34a1..9ba77f4 100644 --- a/layouts/partials/footer_scripts.html +++ b/layouts/partials/footer_scripts.html @@ -8,3 +8,8 @@ hljs.initHighlightingOnLoad(); {{ end }} + + + \ No newline at end of file diff --git a/layouts/partials/head_includes.html b/layouts/partials/head_includes.html index 5dcf8d5..c5faf9e 100644 --- a/layouts/partials/head_includes.html +++ b/layouts/partials/head_includes.html @@ -7,6 +7,8 @@ + + {{range .Site.Params.extracssfiles}} {{end}} diff --git a/static/css/progressively.min.css b/static/css/progressively.min.css new file mode 100644 index 0000000..c8b5d04 --- /dev/null +++ b/static/css/progressively.min.css @@ -0,0 +1 @@ +.progressive{overflow:hidden;position:relative;background:#efefef}.progressive__img{width:100%;height:100%;position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0)}.progressive--not-loaded{filter:blur(30px);-webkit-filter:blur(30px)}.progressive--is-loaded{filter:blur(20px);-webkit-filter:blur(20px);-webkit-animation:sharpen .5s both;animation:sharpen .5s both}@-webkit-keyframes sharpen{from{filter:blur(20px);-webkit-filter:blur(20px)}to{filter:blur(0);-webkit-filter:blur(0)}}@keyframes sharpen{from{filter:blur(20px);-webkit-filter:blur(20px)}to{filter:blur(0);-webkit-filter:blur(0)}} \ No newline at end of file diff --git a/static/js/progressively.min.js b/static/js/progressively.min.js new file mode 100644 index 0000000..eaa60a6 --- /dev/null +++ b/static/js/progressively.min.js @@ -0,0 +1,7 @@ +/*! + * progressively 1.0.0 + * https://github.com/thinker3197/progressively + * @license MIT licensed + * + * Copyright (C) 2016 Ashish + */!function(a,b){"function"==typeof define&&define.amd?define(function(){return b(a)}):"object"==typeof exports?module.exports=b:a.progressively=b(a)}(this,function(a){"use strict";function b(a,b){var c={};for(var d in a)c[d]=b.hasOwnProperty(d)?b[d]:a[d];return c}function c(a){return null===a.offsetParent}function d(a,b){if(c(a))return!1;var d=a.getBoundingClientRect();return d.top>=0&&d.left>=0&&d.right<=(window.innerWidth||document.el.clientWidth)&&(d.bottom<=(window.innerHeight||document.el.clientHeight)||a.clientHeight>=window.innerHeight)}function e(a){setTimeout(function(){var b=new Image;b.onload=function(){a.classList.remove("progressive--not-loaded"),a.classList.add("progressive--is-loaded"),a.src=this.src,i(a)},b.src=a.dataset.progressive},g.delay)}function f(){h||(clearTimeout(h),h=setTimeout(function(){k.check(),k.render(),h=null},g.throttle))}var g,h,i,j,k={};return i=function(){},g={throttle:300,delay:100,onLoadComplete:function(){},onLoad:function(){}},k.init=function(c){c=c||{},g=b(g,c),i=g.onLoad||i,j=[].slice.call(document.querySelectorAll(".progressive__img")),k.render(),document.addEventListener?(a.addEventListener("scroll",f,!1),a.addEventListener("load",f,!1)):(a.attachEvent("onscroll",f),a.attachEvent("onload",f))},k.render=function(){for(var a,b=j.length-1;b>=0;--b)a=j[b],d(a)&&a.classList.contains("progressive--not-loaded")&&(e(a),j.splice(b,1));this.check()},k.check=function(){j.length||(g.onLoadComplete(),this.drop())},k.drop=function(){document.removeEventListener?a.removeEventListener("scroll",f):a.detachEvent("onscroll",f),clearTimeout(h)},k}); \ No newline at end of file