intro.js/docs/js/sticky.min.js

Better introductions for websites and features with a step-by-step guide for your projects

/*! kissui.sticky 2017-02-16 */
!function(a,b){"function"==typeof define&&define.amd?define([],function(){return a.kissuiPosition=b()}):a.kissuiPosition=b(a)}(this,function(){function a(a){if(a="Kissui.position: "+a,1!=q.safeMode)throw Error(a);console.log(a)}function b(){for(var a=document.querySelectorAll("*["+q.attribute+"]"),b=0;b<a.length;b++){var d=a[b],e=d.getAttribute(q.attribute);c(d,e)}}function c(b,c){for(var d=c.split(" "),e=!0,f=0;f<d.length;f++){var g=d[f];if(q.events.indexOf(g)==-1){e=!1;break}}e?m.push({element:b,event:c}):a("Invalid event name: `"+c+"`. Skipping "+b)}function d(){m=[]}function e(a,b){window.addEventListener?window.addEventListener(a,b,!1):window.attachEvent&&window.attachEvent("on"+a,b)}function f(a,b,c){if(c>0){if(b<a&&a<b+c)return!0}else if(b>a&&a>b+c)return!0;return!1}function g(a,b){if(null!=a.parentNode){var c=b.split(" "),d=!0,e=!1,g=a.getBoundingClientRect().top,h=a.getBoundingClientRect().bottom,i=a.getBoundingClientRect().left,k=a.getBoundingClientRect().right,l=a.getBoundingClientRect().height,m=a.getBoundingClientRect().width,n=window.innerHeight||document.documentElement.clientHeight,q=document.body.clientWidth||document.documentElement.clientWidth,r=document.body.scrollTop-o,s=document.body.scrollLeft-p;c.indexOf("in")>-1&&(d=g>=0&&i>=0&&h<=n&&k<=q&&(d&&!0)),c.indexOf("out")>-1&&(e=!0,d=c.indexOf("partially")>-1?(g<0||i<0||k>q||h>n)&&(d&&!0):(g+l<0||i+m<0||i>q||g>n)&&(d&&!0)),c.indexOf("top")>-1&&(d=e?g<0&&(d&&!0):!(0!=g&&!f(0,g,r))&&(d&&!0)),c.indexOf("left")>-1&&(d=!(0!=i&&!f(0,i,s))&&(d&&!0)),c.indexOf("right")>-1&&(d=!(k!=q&&!f(q,k,s))&&(d&&!0)),c.indexOf("bottom")>-1&&(d=!(h!=n&&!f(n,h,r))&&(d&&!0)),c.indexOf("middle")>-1&&(d=!(g+l/2!=n/2&&!f(n/2,g+l/2,r))&&(d&&!0)),c.indexOf("center")>-1&&(d=!(i+m/2!=q/2&&!f(q/2,i+m/2,s))&&(d&&!0)),d&&(a.getAttribute("id")&&j(a.getAttribute("id"),a),j(b,a),j("*",a,b))}}function h(a){for(var b=0;b<a.length;b++)g.call(this,a[b].element,a[b].event);o=document.body.scrollTop,p=document.body.scrollLeft,j("scroll",{top:document.body.scrollTop,left:document.body.scrollLeft})}function i(a,b){"object"!=typeof n[a]&&(n[a]=[]),n[a].push(b)}function j(a){var b,c,d,e=[].slice.call(arguments,1);if("object"==typeof n[a])for(c=n[a].slice(),d=c.length,b=0;b<d;b++)c[b].apply(this,e)}function k(a,b){i(a,function c(){_removeListener(a,c),b.apply(this,arguments)})}function l(){o=document.body.scrollTop,p=document.body.scrollLeft,b.call(this),1==q.triggerOnInit&&h.call(this,m),e("scroll",h.bind(this,m)),e("resize",h.bind(this,m))}var m=[],n=[],o=null,p=null,q={triggerOnInit:!0,attribute:"data-kui-position",safeMode:!1};return q.events=["in","out","partially","middle","top","bottom","left","center","right"],_removeListener=function(a,b){var c;"object"==typeof n[a]&&(c=n[a].indexOf(b),c>-1&&n[a].splice(c,1))},{_options:q,_elements:m,on:i,once:k,removeListener:_removeListener,init:l,positions:h,add:c,reset:d}}),function(a,b){"function"==typeof define&&define.amd?define(["kissuiPosition"],function(c){return a.kissuiSticky=b(c)}):a.kissuiSticky=b(a.kissuiPosition)}(this,function(a){function b(){i=[];for(var a=document.querySelectorAll("*["+h.attribute+"]"),b=0;b<a.length;b++){var d=a[b],e=d.getAttribute(h.attribute),f={};e&&""!=e&&(f.className=e),f.cssText=d.style.cssText,c(d,f)}}function c(b,c){i.push({element:b,active:!1,opts:c}),a.add(b,"partially out top")}function d(a){for(var b=0;b<i.length;b++){var c=i[b];if(a===c.element)return{element:c,i:b}}return null}function e(a,b){if(b.active){var c=b.element;b.active=!1;var d=document.getElementById(h.placeholderId+a);d.parentElement.removeChild(d),c.className=c.className.replace("kui sticky element","").trim(),/scrolled/gi.test(c.className)&&(c.className=c.className.replace("scrolled","").trim()),"undefined"!=typeof b.opts.className&&(c.className=c.className.replace(b.opts.className,"").trim()),c.style.cssText=b.opts.cssText}}function f(b,c){if(b.id.indexOf(h.placeholderId)>-1){var f=parseInt(b.getAttribute("data-id"),10);e(f,i[f])}else{var g=d(b),j=g.element;if(!j.active){var k=b.getBoundingClientRect(),l=b.currentStyle||window.getComputedStyle(b),m=document.createElement("div");m.className="kui sticky placeholder",m.style.width=k.width+"px",m.style.height=k.height+"px",m.style.marginTop=l.marginTop,m.style.marginBottom=l.marginBottom,m.style.marginLeft=l.marginLeft,m.style.marginRight=l.marginRight,m.id="kissui-sticky-placeholder-"+g.i,m.setAttribute("data-id",g.i),b.parentElement.insertBefore(m,b),a.add(m,"in"),a.add(m,"top"),b.className+=" kui sticky element","undefined"!=typeof j.opts.className&&(b.className+=" "+j.opts.className),b.style.cssText+="left: "+k.left+"px!important;",b.style.cssText+="width:"+k.width+"px!important;";var n=parseInt(l.marginTop)+k.height;n>window.innerHeight?(b.style.cssText+="height: 100%!important;",b.className+=" scrolled"):b.style.cssText+="height:"+k.height+"px!important;",j.active=!0}}}function g(){b.call(this),a.on("top",function(a,b){f(a,b)}),a.on("in",function(a,b){f(a,b)}),a.on("partially out top",function(a,b){a.id.indexOf(h.placeholderId)==-1&&f(a,b)}),a.init()}var h={attribute:"data-kui-sticky",placeholderId:"kissui-sticky-placeholder-"},i=[];return g(),{_options:h,_elements:i,init:g,add:c}});