Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

hc-sticky

Package Overview
Dependencies
Maintainers
1
Versions
18
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

hc-sticky - npm Package Compare versions

Comparing version 2.0.1 to 2.1.0

demo/build/browserify.js

21

bower.json
{
"name": "hc-sticky",
"version": "2.0.1",
"version": "2.1.0",
"description": "Cross-browser plugin that makes any element on your page visible while you scroll",

@@ -9,21 +9,4 @@ "homepage": "https://github.com/somewebmedia/hc-sticky",

],
"description": "Cross-browser plugin that makes any element on your page visible while you scroll",
"main": "hc-sticky.js",
"keywords": [
"stick",
"scroll",
"sticky",
"box",
"menu",
"floating"
],
"license": "MIT",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"package.json",
"examples",
"tests"
]
"main": "dist/hc-sticky.js"
}
/*!
* HC-Sticky
* =========
* Version: 2.0.1
* Version: 2.1.0
* Author: Some Web Media

@@ -11,2 +11,2 @@ * Author URL: http://somewebmedia.com

*/
!function(t,e){"use strict";var o={top:0,bottom:0,bottomEnd:0,innerTop:0,innerSticker:null,stickyClass:"sticky",stickTo:null,followScroll:!0,queries:null,queryFlow:"down",onStart:null,onStop:null,onBeforeResize:null,onResize:null,resizeDebounce:100,disable:!1},n=function(i,s){if("string"==typeof i&&(i=e.querySelector(i)),!i)return!1;var r=n.Helpers,l={},a=i.parentNode;"static"===r.getStyle(a,"position")&&(a.style.position="relative");var c=function(t){t=t||{},r.isEmptyObject(t)&&l||(l=Object.assign({},o,l,t))},f=function(t){l=Object.assign({},o,t||{})},d=function(t){return t?l.option||null:Object.assign({},l)},p=function(){return l.disable},u=function(){if(l.queries){var e=t.innerWidth,o=l.queryFlow,n=l.queries;if(f(s),"up"===o)for(var i in n)e>=i&&!r.isEmptyObject(n[i])&&c(n[i]);else{var a=[];for(var d in l.queries){var p={};p[d]=n[d],a.push(p)}for(var u=a.length-1;u>=0;u--){var m=a[u],g=Object.keys(m)[0];e<=g&&!r.isEmptyObject(m[g])&&c(m[g])}}}},m=function(t){var e=r.getCascadedStyle(t),o=r.getStyle(t),n={height:t.offsetHeight+"px",left:e.left,right:e.right,top:e.top,bottom:e.bottom,position:o.position,display:o.display,verticalAlign:o.verticalAlign,boxSizing:o.boxSizing,marginLeft:e.marginLeft,marginRight:e.marginRight,marginTop:e.marginTop,marginBottom:e.marginBottom,paddingLeft:e.paddingLeft,paddingRight:e.paddingRight};return e["float"]&&(n["float"]=e["float"]||"none"),e.cssFloat&&(n.cssFloat=e.cssFloat||"none"),o.MozBoxSizing&&(n.MozBoxSizing=o.MozBoxSizing),n.width="auto"!==e.width?e.width:"border-box"===n.boxSizing||"border-box"===n.MozBoxSizing?t.offsetWidth+"px":o.width,n},g={css:{},position:null,stick:function(t){r.hasClass(i,l.stickyClass)||(y.isAttached===!1&&y.attach(),g.position="fixed",t=t||{},i.style.position="fixed",i.style.left=y.offsetLeft+"px",i.style.width=y.width,"undefined"==typeof t.bottom?i.style.bottom="auto":i.style.bottom=t.bottom+"px","undefined"==typeof t.top?i.style.top="auto":i.style.top=t.top+"px",i.classList?i.classList.add(l.stickyClass):i.className+=" "+l.stickyClass,l.onStart&&l.onStart.call(i,l))},reset:function(t){if(t=t||{},t.disable=t.disable||!1,"fixed"===g.position||null===g.position||!("undefined"==typeof t.top&&"undefined"==typeof t.bottom||"undefined"!=typeof t.top&&(parseInt(r.getStyle(i,"top"))||0)===t.top||"undefined"!=typeof t.bottom&&(parseInt(r.getStyle(i,"bottom"))||0)===t.bottom)){t.disable===!0?y.isAttached===!0&&y.detach():y.isAttached===!1&&y.attach();var e=t.position||g.css.position;g.position=e,i.style.position=e,i.style.left=t.disable===!0?g.css.left:y.positionLeft+"px",i.style.width="absolute"!==e?g.css.width:y.width,"undefined"==typeof t.bottom?i.style.bottom=t.disable===!0?"":"auto":i.style.bottom=t.bottom+"px","undefined"==typeof t.top?i.style.top=t.disable===!0?"":"auto":i.style.top=t.top+"px",i.classList?i.classList.remove(l.stickyClass):i.className=i.className.replace(new RegExp("(^|\\b)"+l.stickyClass.split(" ").join("|")+"(\\b|$)","gi")," "),l.onStop&&l.onStop.call(i,l)}}},y={el:e.createElement("div"),offsetLeft:null,positionLeft:null,width:null,isAttached:!1,init:function(){for(var t in g.css)y.el.style[t]=g.css[t];var e=r.getStyle(i);y.offsetLeft=r.offset(i).left-(parseInt(e.marginLeft)||0),y.positionLeft=r.position(i).left,y.width=r.getStyle(i,"width")},attach:function(){a.insertBefore(y.el,i.nextSibling),y.isAttached=!0},detach:function(){y.el=a.removeChild(y.el),y.isAttached=!1}},v=void 0,h=void 0,b=void 0,S=void 0,w=void 0,x=void 0,k=void 0,L=void 0,T=void 0,E=void 0,C=void 0,j=void 0,z=void 0,N=void 0,O=void 0,H=void 0,R=void 0,B=void 0,I=function(){g.css=m(i),y.init(),v=!(!l.stickTo||!("document"===l.stickTo||l.stickTo.nodeType&&9===l.stickTo.nodeType||"object"==typeof l.stickTo&&l.stickTo instanceof("undefined"!=typeof HTMLDocument?HTMLDocument:Document))),h=l.stickTo?v?e:"string"==typeof l.stickTo?e.querySelector(l.stickTo):l.stickTo:a,B=function(){var t=i.offsetHeight+(parseInt(g.css.marginTop)||0)+(parseInt(g.css.marginBottom)||0),e=(O||0)-t;return e>=-1&&e<=1?O:t},O=B(),R=function(){return v?Math.max(e.documentElement.clientHeight,e.body.scrollHeight,e.documentElement.scrollHeight,e.body.offsetHeight,e.documentElement.offsetHeight):h.offsetHeight},S=R(),w=v?0:r.offset(h).top,x=l.stickTo?v?0:r.offset(a).top:w,k=t.innerHeight,H=i.offsetTop-(parseInt(g.css.marginTop)||0),b=l.innerSticker?"string"==typeof l.innerSticker?e.querySelector(l.innerSticker):l.innerSticker:null,L=isNaN(l.top)&&l.top.indexOf("%")>-1?parseFloat(l.top)/100*k:l.top,T=isNaN(l.bottom)&&l.bottom.indexOf("%")>-1?parseFloat(l.bottom)/100*k:l.bottom,E=b?b.offsetTop:l.innerTop?l.innerTop:0,C=isNaN(l.bottomEnd)&&l.bottomEnd.indexOf("%")>-1?parseFloat(l.bottomEnd)/100*k:l.bottomEnd,j=w-L+E+H},q=t.pageYOffset||e.documentElement.scrollTop,A=0,F=void 0,M=function(){O=B(),S=R(),z=w+S-L-C,N=O>k;var o=t.pageYOffset||e.documentElement.scrollTop,n=r.offset(i).top,s=n-o,c=void 0;F=o<q?"up":"down",A=o-q,q=o,o>j?z+L+(N?T:0)-(l.followScroll&&N?0:L)<=o+O-E-(O-E>k-(j-E)&&l.followScroll&&(c=O-k-E)>0?c:0)?g.reset({position:"absolute",bottom:x+a.offsetHeight-z-L}):N&&l.followScroll?"down"===F?s+O+T<=k?g.stick({bottom:T}):"fixed"===g.position&&g.reset({position:"absolute",top:n-L-j-A+E}):s+E<0&&"fixed"===g.position?g.reset({position:"absolute",top:n-L-j+E-A}):n>=o+L-E&&g.stick({top:L-E}):g.stick({top:L-E}):g.reset({disable:!0})},D=!1,W=!1,P=function(){D&&(eventie.unbind(t,"scroll",M),D=!1)},V=function(){return I(),O>=S?void P():(M(),void(D||(eventie.bind(t,"scroll",M),D=!0)))},Y=function(){i.style.position="",i.style.left="",i.style.top="",i.style.bottom="",i.style.width="",i.classList?i.classList.remove(l.stickyClass):i.className=i.className.replace(new RegExp("(^|\\b)"+l.stickyClass.split(" ").join("|")+"(\\b|$)","gi")," "),g.css={},g.position=null,y.isAttached===!0&&y.detach()},$=function(){return Y(),u(),p()?void P():void V()},Q=function(){l.onBeforeResize&&l.onBeforeResize.call(i,l),$(),l.onResize&&l.onResize.call(i,l)},U=l.resizeDebounce?r.debounce(Q,l.resizeDebounce):Q,X=function(t){c(t),$()},G=function(){W&&(eventie.unbind(t,"resize",U),W=!1),P()},J=function(){G(),Y()},K=function(){return W||(eventie.bind(t,"resize",U),W=!0),u(),p()?void P():void V()};this.options=d,this.reinit=$,this.update=X,this.attach=K,this.detach=G,this.destroy=J,c(s),K(),eventie.bind(t,"load",$)};if("function"==typeof define&&define.amd?define(n):"object"==typeof exports?module.exports=n:t.hcSticky=t.hcSticky||n,"undefined"!=typeof t.jQuery){var i=t.jQuery;i.fn.extend({hcSticky:function(t){return this.length?this.each(function(){var e="hcSticky",o=i.data(this,e);o?o.update(t):(o=new n(this,t),i.data(this,e,o))}):this}})}}(window,window.document),function(t,e,o){"use strict";"function"!=typeof Object.assign&&Object.defineProperty(Object,"assign",{value:function(t,e){if(null==t)throw new TypeError("Cannot convert undefined or null to object");for(var o=Object(t),n=1;n<arguments.length;n++){var i=arguments[n];if(null!=i)for(var s in i)Object.prototype.hasOwnProperty.call(i,s)&&(o[s]=i[s])}return o},writable:!0,configurable:!0});var n=function(t){for(var e in t)return!1;return!0},i=function(t,e,o){var n=void 0;return function(){var i=this,s=arguments,r=function(){n=null,o||t.apply(i,s)},l=o&&!n;clearTimeout(n),n=setTimeout(r,e),l&&t.apply(i,s)}},s=function(t,n){return e.getComputedStyle?n?o.defaultView.getComputedStyle(t,null).getPropertyValue(n):o.defaultView.getComputedStyle(t,null):t.currentStyle?n?t.currentStyle[n.replace(/-\w/g,function(t){return t.toUpperCase().replace("-","")})]:t.currentStyle:void 0},r=function(t,e){return t.classList?t.classList.contains(e):new RegExp("(^| )"+e+"( |$)","gi").test(t.className)},l=function(t){var n=t.getBoundingClientRect(),i=e.pageYOffset||o.documentElement.scrollTop,s=e.pageXOffset||o.documentElement.scrollLeft;return{top:n.top+i,left:n.left+s}},a=function(t){var e=t.offsetParent,o=l(e),n=l(t),i=s(e),r=s(t);return o.top+=parseInt(i.borderTopWidth)||0,o.left+=parseInt(i.borderLeftWidth)||0,{top:n.top-o.top-(parseInt(r.marginTop)||0),left:n.left-o.left-(parseInt(r.marginLeft)||0)}},c=function(t){var n=t.cloneNode(!0);n.style.display="none",t.parentNode.insertBefore(n,t.nextSibling);var i=void 0;n.currentStyle?i=n.currentStyle:e.getComputedStyle&&(i=o.defaultView.getComputedStyle(n,null));var s={};for(var r in i)!isNaN(r)||"string"!=typeof i[r]&&"number"!=typeof i[r]||(s[r]=i[r]);if(Object.keys(s).length<3){s={};for(var l in i)isNaN(l)||(s[i[l].replace(/-\w/g,function(t){return t.toUpperCase().replace("-","")})]=i.getPropertyValue(i[l]))}if(s.margin||"auto"!==s.marginLeft?s.margin||s.marginLeft!==s.marginRight||s.marginLeft!==s.marginTop||s.marginLeft!==s.marginBottom||(s.margin=s.marginLeft):s.margin="auto",!s.margin&&"0px"===s.marginLeft&&"0px"===s.marginRight){var a=t.offsetLeft-t.parentNode.offsetLeft,c=a-(parseInt(s.left)||0)-(parseInt(s.right)||0),f=t.parentNode.offsetWidth-t.offsetWidth-a-(parseInt(s.right)||0)+(parseInt(s.left)||0),d=f-c;0!==d&&1!==d||(s.margin="auto")}return n.parentNode.removeChild(n),n=null,s||null};t.Helpers={},t.Helpers.isEmptyObject=n,t.Helpers.debounce=i,t.Helpers.hasClass=r,t.Helpers.offset=l,t.Helpers.position=a,t.Helpers.getStyle=s,t.Helpers.getCascadedStyle=c}(window.hcSticky,window,window.document),function(t){"use strict";function e(e){var o=t.event;return o.target=o.target||o.srcElement||e,o}var o=document.documentElement,n=function(){};o.addEventListener?n=function(t,e,o){t.addEventListener(e,o,!1)}:o.attachEvent&&(n=function(t,o,n){t[o+n]=n.handleEvent?function(){var o=e(t);n.handleEvent.call(n,o)}:function(){var o=e(t);n.call(t,o)},t.attachEvent("on"+o,t[o+n])});var i=function(){};o.removeEventListener?i=function(t,e,o){t.removeEventListener(e,o,!1)}:o.detachEvent&&(i=function(t,e,o){t.detachEvent("on"+e,t[e+o]);try{delete t[e+o]}catch(n){t[e+o]=void 0}});var s={bind:n,unbind:i};"function"==typeof define&&define.amd?define(s):"object"==typeof exports?module.exports=s:t.eventie=s}(window);
!function(t,e){"use strict";if("object"==typeof module&&"object"==typeof module.exports){if(!t.document)throw new Error("HC-Sticky requires a browser to run.");module.exports=e(t)}else"function"==typeof define&&define.amd?define("hcSticky",[],e(t)):e(t)}("undefined"!=typeof window?window:this,function(t){"use strict";var e={top:0,bottom:0,bottomEnd:0,innerTop:0,innerSticker:null,stickyClass:"sticky",stickTo:null,followScroll:!0,queries:null,queryFlow:"down",onStart:null,onStop:null,onBeforeResize:null,onResize:null,resizeDebounce:100,disable:!1},o=t.document,i=function(n,s){if("string"==typeof n&&(n=o.querySelector(n)),!n)return!1;var r={},l=i.Helpers,a=n.parentNode;"static"===l.getStyle(a,"position")&&(a.style.position="relative");var c=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};l.isEmptyObject(t)&&r||(r=Object.assign({},e,r,t))},f=function(){return r.disable},d=function(){if(r.queries){var o=t.innerWidth,i=r.queryFlow,n=r.queries;if(function(t){r=Object.assign({},e,t||{})}(s),"up"===i)for(var a in n)o>=a&&!l.isEmptyObject(n[a])&&c(n[a]);else{var f=[];for(var d in r.queries){var u={};u[d]=n[d],f.push(u)}for(var p=f.length-1;p>=0;p--){var g=f[p],m=Object.keys(g)[0];o<=m&&!l.isEmptyObject(g[m])&&c(g[m])}}}},u={css:{},position:null,stick:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};l.hasClass(n,r.stickyClass)||(!1===p.isAttached&&p.attach(),u.position="fixed",n.style.position="fixed",n.style.left=p.offsetLeft+"px",n.style.width=p.width,void 0===t.bottom?n.style.bottom="auto":n.style.bottom=t.bottom+"px",void 0===t.top?n.style.top="auto":n.style.top=t.top+"px",n.classList?n.classList.add(r.stickyClass):n.className+=" "+r.stickyClass,r.onStart&&r.onStart.call(n,r))},reset:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(t.disable=t.disable||!1,"fixed"===u.position||null===u.position||!(void 0===t.top&&void 0===t.bottom||void 0!==t.top&&(parseInt(l.getStyle(n,"top"))||0)===t.top||void 0!==t.bottom&&(parseInt(l.getStyle(n,"bottom"))||0)===t.bottom)){!0===t.disable?!0===p.isAttached&&p.detach():!1===p.isAttached&&p.attach();var e=t.position||u.css.position;u.position=e,n.style.position=e,n.style.left=!0===t.disable?u.css.left:p.positionLeft+"px",n.style.width="absolute"!==e?u.css.width:p.width,void 0===t.bottom?n.style.bottom=!0===t.disable?"":"auto":n.style.bottom=t.bottom+"px",void 0===t.top?n.style.top=!0===t.disable?"":"auto":n.style.top=t.top+"px",n.classList?n.classList.remove(r.stickyClass):n.className=n.className.replace(new RegExp("(^|\\b)"+r.stickyClass.split(" ").join("|")+"(\\b|$)","gi")," "),r.onStop&&r.onStop.call(n,r)}}},p={el:o.createElement("div"),offsetLeft:null,positionLeft:null,width:null,isAttached:!1,init:function(){for(var t in u.css)p.el.style[t]=u.css[t];var e=l.getStyle(n);p.offsetLeft=l.offset(n).left-(parseInt(e.marginLeft)||0),p.positionLeft=l.position(n).left,p.width=l.getStyle(n,"width")},attach:function(){a.insertBefore(p.el,n.nextSibling),p.isAttached=!0},detach:function(){p.el=a.removeChild(p.el),p.isAttached=!1}},g=void 0,m=void 0,v=void 0,h=void 0,y=void 0,b=void 0,S=void 0,w=void 0,k=void 0,x=void 0,L=void 0,E=void 0,T=void 0,C=void 0,j=void 0,z=void 0,N=void 0,O=void 0,R=function(){u.css=function(t){var e=l.getCascadedStyle(t),o=l.getStyle(t),i={height:t.offsetHeight+"px",left:e.left,right:e.right,top:e.top,bottom:e.bottom,position:o.position,display:o.display,verticalAlign:o.verticalAlign,boxSizing:o.boxSizing,marginLeft:e.marginLeft,marginRight:e.marginRight,marginTop:e.marginTop,marginBottom:e.marginBottom,paddingLeft:e.paddingLeft,paddingRight:e.paddingRight};return e.float&&(i.float=e.float||"none"),e.cssFloat&&(i.cssFloat=e.cssFloat||"none"),o.MozBoxSizing&&(i.MozBoxSizing=o.MozBoxSizing),i.width="auto"!==e.width?e.width:"border-box"===i.boxSizing||"border-box"===i.MozBoxSizing?t.offsetWidth+"px":o.width,i}(n),p.init(),g=!(!r.stickTo||!("document"===r.stickTo||r.stickTo.nodeType&&9===r.stickTo.nodeType||"object"==typeof r.stickTo&&r.stickTo instanceof("undefined"!=typeof HTMLDocument?HTMLDocument:Document))),m=r.stickTo?g?o:"string"==typeof r.stickTo?o.querySelector(r.stickTo):r.stickTo:a,j=(O=function(){var t=n.offsetHeight+(parseInt(u.css.marginTop)||0)+(parseInt(u.css.marginBottom)||0),e=(j||0)-t;return e>=-1&&e<=1?j:t})(),h=(N=function(){return g?Math.max(o.documentElement.clientHeight,o.body.scrollHeight,o.documentElement.scrollHeight,o.body.offsetHeight,o.documentElement.offsetHeight):m.offsetHeight})(),y=g?0:l.offset(m).top,b=r.stickTo?g?0:l.offset(a).top:y,S=t.innerHeight,z=n.offsetTop-(parseInt(u.css.marginTop)||0),v=r.innerSticker?"string"==typeof r.innerSticker?o.querySelector(r.innerSticker):r.innerSticker:null,w=isNaN(r.top)&&r.top.indexOf("%")>-1?parseFloat(r.top)/100*S:r.top,k=isNaN(r.bottom)&&r.bottom.indexOf("%")>-1?parseFloat(r.bottom)/100*S:r.bottom,x=v?v.offsetTop:r.innerTop?r.innerTop:0,L=isNaN(r.bottomEnd)&&r.bottomEnd.indexOf("%")>-1?parseFloat(r.bottomEnd)/100*S:r.bottomEnd,E=y-w+x+z},H=t.pageYOffset||o.documentElement.scrollTop,B=0,I=void 0,q=function(){j=O(),h=N(),T=y+h-w-L,C=j>S;var e=t.pageYOffset||o.documentElement.scrollTop,i=l.offset(n).top,s=i-e,c=void 0;I=e<H?"up":"down",B=e-H,H=e,e>E?T+w+(C?k:0)-(r.followScroll&&C?0:w)<=e+j-x-(j-x>S-(E-x)&&r.followScroll&&(c=j-S-x)>0?c:0)?u.reset({position:"absolute",bottom:b+a.offsetHeight-T-w}):C&&r.followScroll?"down"===I?s+j+k<=S?u.stick({bottom:k}):"fixed"===u.position&&u.reset({position:"absolute",top:i-w-E-B+x}):s+x<0&&"fixed"===u.position?u.reset({position:"absolute",top:i-w-E+x-B}):i>=e+w-x&&u.stick({top:w-x}):u.stick({top:w-x}):u.reset({disable:!0})},A=!1,F=!1,M=function(){A&&(l.event.unbind(t,"scroll",q),A=!1)},D=function(){R(),j>=h?M():(q(),A||(l.event.bind(t,"scroll",q),A=!0))},W=function(){n.style.position="",n.style.left="",n.style.top="",n.style.bottom="",n.style.width="",n.classList?n.classList.remove(r.stickyClass):n.className=n.className.replace(new RegExp("(^|\\b)"+r.stickyClass.split(" ").join("|")+"(\\b|$)","gi")," "),u.css={},u.position=null,!0===p.isAttached&&p.detach()},P=function(){W(),d(),f()?M():D()},V=function(){r.onBeforeResize&&r.onBeforeResize.call(n,r),P(),r.onResize&&r.onResize.call(n,r)},Y=r.resizeDebounce?l.debounce(V,r.resizeDebounce):V,$=function(){F&&(l.event.unbind(t,"resize",Y),F=!1),M()},Q=function(){F||(l.event.bind(t,"resize",Y),F=!0),d(),f()?M():D()};this.options=function(t){return t?r.option||null:Object.assign({},r)},this.reinit=P,this.update=function(t){c(t),P()},this.attach=Q,this.detach=$,this.destroy=function(){$(),W()},c(s),Q(),l.event.bind(t,"load",P)};if(void 0!==t.jQuery){var n=t.jQuery;n.fn.extend({hcSticky:function(t){return this.length?this.each(function(){var e=n.data(this,"hcSticky");e?e.update(t):(e=new i(this,t),n.data(this,"hcSticky",e))}):this}})}return t.hcSticky=t.hcSticky||i,i}),function(t){"use strict";var e=t.hcSticky,o=t.document;"function"!=typeof Object.assign&&Object.defineProperty(Object,"assign",{value:function(t,e){if(null==t)throw new TypeError("Cannot convert undefined or null to object");for(var o=Object(t),i=1;i<arguments.length;i++){var n=arguments[i];if(null!=n)for(var s in n)Object.prototype.hasOwnProperty.call(n,s)&&(o[s]=n[s])}return o},writable:!0,configurable:!0});var i=function(){function e(e){var o=t.event;return o.target=o.target||o.srcElement||e,o}var i=o.documentElement,n=function(){};i.addEventListener?n=function(t,e,o){t.addEventListener(e,o,!1)}:i.attachEvent&&(n=function(t,o,i){t[o+i]=i.handleEvent?function(){var o=e(t);i.handleEvent.call(i,o)}:function(){var o=e(t);i.call(t,o)},t.attachEvent("on"+o,t[o+i])});var s=function(){};return i.removeEventListener?s=function(t,e,o){t.removeEventListener(e,o,!1)}:i.detachEvent&&(s=function(t,e,o){t.detachEvent("on"+e,t[e+o]);try{delete t[e+o]}catch(i){t[e+o]=void 0}}),{bind:n,unbind:s}}(),n=function(e,i){return t.getComputedStyle?i?o.defaultView.getComputedStyle(e,null).getPropertyValue(i):o.defaultView.getComputedStyle(e,null):e.currentStyle?i?e.currentStyle[i.replace(/-\w/g,function(t){return t.toUpperCase().replace("-","")})]:e.currentStyle:void 0},s=function(e){var i=e.getBoundingClientRect(),n=t.pageYOffset||o.documentElement.scrollTop,s=t.pageXOffset||o.documentElement.scrollLeft;return{top:i.top+n,left:i.left+s}};e.Helpers={isEmptyObject:function(t){for(var e in t)return!1;return!0},debounce:function(t,e,o){var i=void 0;return function(){var n=this,s=arguments,r=o&&!i;clearTimeout(i),i=setTimeout(function(){i=null,o||t.apply(n,s)},e),r&&t.apply(n,s)}},hasClass:function(t,e){return t.classList?t.classList.contains(e):new RegExp("(^| )"+e+"( |$)","gi").test(t.className)},offset:s,position:function(t){var e=t.offsetParent,o=s(e),i=s(t),r=n(e),l=n(t);return o.top+=parseInt(r.borderTopWidth)||0,o.left+=parseInt(r.borderLeftWidth)||0,{top:i.top-o.top-(parseInt(l.marginTop)||0),left:i.left-o.left-(parseInt(l.marginLeft)||0)}},getStyle:n,getCascadedStyle:function(e){var i=e.cloneNode(!0);i.style.display="none",e.parentNode.insertBefore(i,e.nextSibling);var n=void 0;i.currentStyle?n=i.currentStyle:t.getComputedStyle&&(n=o.defaultView.getComputedStyle(i,null));var s={};for(var r in n)!isNaN(r)||"string"!=typeof n[r]&&"number"!=typeof n[r]||(s[r]=n[r]);if(Object.keys(s).length<3){s={};for(var l in n)isNaN(l)||(s[n[l].replace(/-\w/g,function(t){return t.toUpperCase().replace("-","")})]=n.getPropertyValue(n[l]))}if(s.margin||"auto"!==s.marginLeft?s.margin||s.marginLeft!==s.marginRight||s.marginLeft!==s.marginTop||s.marginLeft!==s.marginBottom||(s.margin=s.marginLeft):s.margin="auto",!s.margin&&"0px"===s.marginLeft&&"0px"===s.marginRight){var a=e.offsetLeft-e.parentNode.offsetLeft,c=a-(parseInt(s.left)||0)-(parseInt(s.right)||0),f=e.parentNode.offsetWidth-e.offsetWidth-a-(parseInt(s.right)||0)+(parseInt(s.left)||0)-c;0!==f&&1!==f||(s.margin="auto")}return i.parentNode.removeChild(i),i=null,s},event:i}}(window);

@@ -10,2 +10,3 @@ const gulp = require('gulp');

const uglify = require('gulp-uglify');
const saveLicense = require('uglify-save-license');
const fs = require('fs');

@@ -15,11 +16,12 @@ const path = require('path');

const open = require('gulp-open');
const browserify = require('gulp-browserify');
const argv = require('yargs').argv;
/* Main JS */
gulp.task('js', () => {
return gulp.src([
'./src/hc-sticky.js',
'./src/hc-sticky.helpers.js',
'./node_modules/eventie/eventie.js'
'./src/hc-sticky.helpers.js'
])
.pipe(concat('hc-sticky.js'))
.pipe(babel({

@@ -31,14 +33,21 @@ plugins: [

'transform-es2015-block-scoping',
'transform-es2015-parameters',
'transform-es2015-shorthand-properties'
]
}))
.pipe(argv.dev ? through.obj() : uglify())
.pipe(concat('hc-sticky.js'))
.pipe(argv.dev ? through.obj() : uglify({
output: {
comments: saveLicense
}
}))
.pipe(gulp.dest('./dist'));
});
/* Demos */
/* Demo */
const demos_dest = './demos/compiled';
const demo_dest = './demo/build';
gulp.task('demos-sass', () => {
return gulp.src(['./demos/src/*.scss'])
gulp.task('demo-sass', () => {
return gulp.src(['./demo/src/*.scss'])
.pipe(sass({

@@ -48,7 +57,7 @@ 'outputStyle': argv.dev ? 'development' : 'compressed'

.pipe(autoprefixer())
.pipe(gulp.dest(demos_dest));
.pipe(gulp.dest(demo_dest));
});
gulp.task('demos-html', () => {
const demos = glob.sync('./demos/src/*.html') || [];
gulp.task('demo-html', () => {
const demos = glob.sync('./demo/src/*.html') || [];

@@ -64,11 +73,29 @@ demos.forEach((item, i) => {

style_path: 'demos.css',
sticky_path: '../../dist/hc-sticky.js'
sticky_path: '../../dist/hc-sticky.js',
browserify_path: 'browserify.js'
}))
.pipe(gulp.dest(demos_dest));
.pipe(gulp.dest(demo_dest));
});
const compile = (openHtml) => {
gulp.task('demo-browserify', () => {
return gulp.src(['./demo/src/browserify.js'])
.pipe(browserify({
insertGlobals: true
}))
.pipe(babel({
plugins: [
'check-es2015-constants',
'transform-es2015-arrow-functions',
'transform-es2015-block-scoped-functions',
'transform-es2015-block-scoping'
]
}))
.pipe(argv.dev ? through.obj() : uglify())
.pipe(gulp.dest(demo_dest));
});
const compileHtml = (openHtml) => {
openHtml = openHtml || false;
const demos = glob.sync('./demos/src/*.html') || [];
const demos = glob.sync('./demo/src/*.html') || [];
let demos_content = '';

@@ -107,11 +134,11 @@

if (openHtml) {
return gulp.src('./demos/src/index.html')
return gulp.src('./demo/src/index.html')
.pipe(template(template_options))
.pipe(gulp.dest(demos_dest))
.pipe(gulp.dest(demo_dest))
.pipe(open());
}
else {
return gulp.src('./demos/src/index.html')
return gulp.src('./demo/src/index.html')
.pipe(template(template_options))
.pipe(gulp.dest(demos_dest));
.pipe(gulp.dest(demo_dest));
}

@@ -121,15 +148,18 @@ };

gulp.task('open-html', () => {
compile(true);
compileHtml(true);
});
gulp.task('main-html', () => {
compile(false);
compileHtml(false);
});
gulp.task('watch', ['js', 'demos-sass', 'demos-html', 'open-html'], () => {
gulp.watch(['./src/*.js'], ['js']);
gulp.watch(['./**/*.scss'], ['demos-sass']);
gulp.watch(['./**/*.html'], ['demos-html', 'main-html']);
/* Gulp Tasks */
gulp.task('default', ['js', 'demo-sass', 'demo-html', 'demo-browserify', 'open-html']);
gulp.task('watch', ['js', 'demo-sass', 'demo-html', 'demo-browserify', 'open-html'], () => {
gulp.watch(['./src/*.js'], ['js', 'demo-browserify']);
gulp.watch(['./demo/src/*.js'], ['demo-browserify']);
gulp.watch(['./demo/src/*.scss'], ['demo-sass']);
gulp.watch(['./demo/src/*.html'], ['demo-html', 'main-html']);
});
gulp.task('default', ['js', 'demos-sass', 'demos-html', 'open-html']);
{
"name": "hc-sticky",
"version": "2.0.1",
"version": "2.1.0",
"description": "Cross-browser plugin that makes any element on your page visible while you scroll",

@@ -8,2 +8,6 @@ "main": "dist/hc-sticky.js",

"license": "MIT",
"repository": {
"type": "git",
"url": "git+https://github.com/somewebmedia/hc-sticky.git"
},
"dependencies": {},

@@ -16,4 +20,5 @@ "devDependencies": {

"babel-plugin-transform-es2015-block-scoping": "^6.26.0",
"babel-plugin-transform-es2015-parameters": "^6.24.1",
"babel-plugin-transform-es2015-shorthand-properties": "^6.24.1",
"cheerio": "^0.22.0",
"eventie": "^1.0.6",
"glob": "^7.1.2",

@@ -23,2 +28,3 @@ "gulp": "^3.9.1",

"gulp-babel": "^7.0.0",
"gulp-browserify": "^0.5.1",
"gulp-concat": "^2.6.1",

@@ -28,8 +34,5 @@ "gulp-open": "^2.0.0",

"gulp-template": "^4.0.0",
"gulp-uglify": "^1.5.3"
},
"repository": {
"type": "git",
"url": "git+https://github.com/somewebmedia/hc-sticky.git"
"gulp-uglify": "^3.0.0",
"uglify-save-license": "^0.4.1"
}
}

@@ -7,29 +7,52 @@ HC-Sticky

## Usage
## Quick start
### Install
This package can be installed with:
- [npm](https://www.npmjs.com/package/hc-sticky): `npm install --save hc-sticky`
- [bower](http://bower.io/search/?q=hc-sticky): `bower install --save hc-sticky`
Or download the [latest release](https://github.com/somewebmedia/hc-sticky/releases).
### Load
#### Static HTML
```html
<script src="/path/to/hc-sticky.js"></script>
<script src="/path_to/hc-sticky.js"></script>
```
<script>
// call this script just before closing </html> or after your #element
var Sticky = new hcSticky('#element', {
stickTo: '#content'
});
</script>
#### Browserify
In the script, including HC-Sticky will usually look like this:
```js
const hcSticky = require('hc-sticky');
```
### jQuery
```html
<script src="/path/to/hc-sticky.js"></script>
### Usage
<script>
jQuery(document).ready(function($) {
$('#element').hcSticky({
stickTo: '#content'
});
Be sure to call HC-Sticky once your element is available in the DOM.
```js
var Sticky = new hcSticky('#element', {
stickTo: '#content'
});
```
#### jQuery
```js
jQuery(document).ready(function($) {
$('#element').hcSticky({
stickTo: '#content'
});
</script>
});
```
## Options

@@ -57,3 +80,3 @@

## Methods
### Methods

@@ -63,3 +86,4 @@ Methods are used to control the plugin after initialization.

Example:
```javascript
```js
var Sticky = new hcSticky('#element', {

@@ -78,5 +102,20 @@ stickTo: '#content'

| *`update`* | object | Updates the settings with the new ones. |
| *`reinit`* | | Recalculates sticky size and position. Useful after altering DOM elements inside sticky. |
| *`detach`* | | Detaches the HC-Sticky from element, preventing it from running. |
| *`attach`* | | Attaches the HC-Sticky back to the element. |
| *`destroy`* | | Completely destroys HC-Sticky and reverts element to original state. |
| *`reinit`* | N/A | Recalculates sticky size and position. Useful after altering DOM elements inside sticky. |
| *`detach`* | N/A | Detaches the HC-Sticky from element, preventing it from running. |
| *`attach`* | N/A | Attaches the HC-Sticky back to the element. |
| *`destroy`* | N/A | Completely destroys HC-Sticky and reverts element to original state. |
## Building
This package comes with [Gulp](https://gulpjs.com/). The following tasks are available:
* `default` compiles the JS into `/dist` and builds the Demos into `demo/build`.
* `watch` watches source JS and Demo files and builds them automatically whenever you save.
You can pass a `--dev` command if you don't want the compiled JS to be minified.
## License
The code and the documentation are released under the MIT License.

@@ -1,4 +0,7 @@

((hcSticky, window, document) => {
((window) => {
'use strict';
const hcSticky = window.hcSticky;
const document = window.document;
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

@@ -33,2 +36,58 @@ if (typeof Object.assign !== 'function') {

// https://github.com/desandro/eventie
const event = (() => {
var docElem = document.documentElement;
var bind = function() {};
function getIEEvent( obj ) {
var event = window.event;
// add event.target
event.target = event.target || event.srcElement || obj;
return event;
}
if ( docElem.addEventListener ) {
bind = function( obj, type, fn ) {
obj.addEventListener( type, fn, false );
};
} else if ( docElem.attachEvent ) {
bind = function( obj, type, fn ) {
obj[ type + fn ] = fn.handleEvent ?
function() {
var event = getIEEvent( obj );
fn.handleEvent.call( fn, event );
} :
function() {
var event = getIEEvent( obj );
fn.call( obj, event );
};
obj.attachEvent( "on" + type, obj[ type + fn ] );
};
}
var unbind = function() {};
if ( docElem.removeEventListener ) {
unbind = function( obj, type, fn ) {
obj.removeEventListener( type, fn, false );
};
} else if ( docElem.detachEvent ) {
unbind = function( obj, type, fn ) {
obj.detachEvent( "on" + type, obj[ type + fn ] );
try {
delete obj[ type + fn ];
} catch ( err ) {
// can't delete window object properties
obj[ type + fn ] = undefined;
}
};
}
return {
bind: bind,
unbind: unbind
};
})();
const isEmptyObject = (obj) => {

@@ -159,18 +218,18 @@ for (const name in obj) {

// check for margin:auto
if (!style['margin'] && style['marginLeft'] === 'auto') {
style['margin'] = 'auto';
if (!style.margin && style.marginLeft === 'auto') {
style.margin = 'auto';
}
else if (!style['margin'] && style['marginLeft'] === style['marginRight'] && style['marginLeft'] === style['marginTop'] && style['marginLeft'] === style['marginBottom']) {
style['margin'] = style['marginLeft'];
else if (!style.margin && style.marginLeft === style.marginRight && style.marginLeft === style.marginTop && style.marginLeft === style.marginBottom) {
style.margin = style.marginLeft;
}
// safari margin:auto hack
if (!style['margin'] && style['marginLeft'] === '0px' && style['marginRight'] === '0px') {
if (!style.margin && style.marginLeft === '0px' && style.marginRight === '0px') {
const posLeft = el.offsetLeft - el.parentNode.offsetLeft;
const marginLeft = posLeft - (parseInt(style['left']) || 0) - (parseInt(style['right']) || 0);
const marginRight = el.parentNode.offsetWidth - el.offsetWidth - posLeft - (parseInt(style['right']) || 0) + (parseInt(style['left']) || 0);
const marginLeft = posLeft - (parseInt(style.left) || 0) - (parseInt(style.right) || 0);
const marginRight = el.parentNode.offsetWidth - el.offsetWidth - posLeft - (parseInt(style.right) || 0) + (parseInt(style.left) || 0);
const diff = marginRight - marginLeft;
if (diff === 0 || diff === 1) {
style['margin'] = 'auto';
style.margin = 'auto';
}

@@ -183,14 +242,16 @@ }

return style || null;
return style;
};
hcSticky.Helpers = {};
hcSticky.Helpers.isEmptyObject = isEmptyObject;
hcSticky.Helpers.debounce = debounce;
hcSticky.Helpers.hasClass = hasClass;
hcSticky.Helpers.offset = offset;
hcSticky.Helpers.position = position;
hcSticky.Helpers.getStyle = getStyle;
hcSticky.Helpers.getCascadedStyle = getCascadedStyle;
hcSticky.Helpers = {
isEmptyObject,
debounce,
hasClass,
offset,
position,
getStyle,
getCascadedStyle,
event
};
})(window.hcSticky, window, window.document);
})(window);
/*!
* HC-Sticky
* =========
* Version: 2.0.1
* Version: 2.1.0
* Author: Some Web Media

@@ -12,5 +12,22 @@ * Author URL: http://somewebmedia.com

((window, document) => {
(function(global, factory) {
'use strict';
if (typeof module === 'object' && typeof module.exports === 'object') {
if (global.document) {
module.exports = factory(global);
}
else {
throw new Error('HC-Sticky requires a browser to run.');
}
}
else if (typeof define === 'function' && define.amd) {
define('hcSticky', [], factory(global));
}
else {
factory(global);
}
})(typeof window !== 'undefined' ? window : this, (window) => {
'use strict';
const defaultOptions = {

@@ -35,2 +52,4 @@ top: 0,

const document = window.document;
const hcSticky = function(elem, userSettings) {

@@ -47,4 +66,4 @@ // use querySeletor if string is passed

let stickyOptions = {};
const Helpers = hcSticky.Helpers;
let stickyOptions = {};
const elemParent = elem.parentNode;

@@ -57,5 +76,3 @@

const setOptions = (options) => {
options = options || {};
const setOptions = (options = {}) => {
// nothing to set

@@ -165,3 +182,3 @@ if (Helpers.isEmptyObject(options) && stickyOptions) {

position: null, // so we don't need to check css all the time
stick: (args) => {
stick: (args = {}) => {
if (Helpers.hasClass(elem, stickyOptions.stickyClass)) {

@@ -178,4 +195,2 @@ // check if element is already sticky

args = args || {};
// apply styles

@@ -213,4 +228,3 @@ elem.style.position = 'fixed';

},
reset: (args) => {
args = args || {};
reset: (args = {}) => {
args.disable = args.disable || false;

@@ -506,3 +520,3 @@

// detach sticky from scroll
eventie.unbind(window, 'scroll', runSticky);
Helpers.event.unbind(window, 'scroll', runSticky);

@@ -530,3 +544,3 @@ // sticky is not attached to scroll anymore

// attach sticky to scroll
eventie.bind(window, 'scroll', runSticky);
Helpers.event.bind(window, 'scroll', runSticky);

@@ -603,3 +617,3 @@ // sticky is attached to scroll

if (resizeAttached) {
eventie.unbind(window, 'resize', resize_cb);
Helpers.event.unbind(window, 'resize', resize_cb);
resizeAttached = false;

@@ -619,3 +633,3 @@ }

if (!resizeAttached) {
eventie.bind(window, 'resize', resize_cb);
Helpers.event.bind(window, 'resize', resize_cb);
resizeAttached = true;

@@ -648,20 +662,6 @@ }

// reinit on complete page load
eventie.bind(window, 'load', reinitSticky);
Helpers.event.bind(window, 'load', reinitSticky);
};
/* Module definition */
if (typeof define === 'function' && define.amd) {
// AMD
define(hcSticky);
}
else if (typeof exports === 'object') {
// CommonJS
module.exports = hcSticky;
}
else {
// browser global
window.hcSticky = window.hcSticky || hcSticky;
}
/* jQuery Plugin */
// jQuery Plugin
if (typeof window.jQuery !== 'undefined') {

@@ -694,2 +694,7 @@ const $ = window.jQuery;

}
})(window, window.document);
// browser global
window.hcSticky = window.hcSticky || hcSticky;
return hcSticky;
});
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc