somewebmedia / hc-sticky

JavaScript library that makes any element on your page visible while you scroll.
https://somewebmedia.github.io/hc-sticky/
MIT License
463 stars 115 forks source link

I don't understand how use "responsive" #55

Closed leran closed 6 years ago

leran commented 6 years ago

Please, give an examples what should the object look like

somewebmedia commented 6 years ago

Hi @leran, you use the same settings just within the media query you want, like this:

{
  top: 20,
  responsive: {
    1024: {
      top: 0
    }
  }
}

So this means, the sticky will have the top set to 0 below the 1024px of the screen width.

And you also use mobileFirst if you want the direction of the queries to go from lover to higher.

So you could write it like this:

{
  top: 0,
  mobileFirst: true,
  responsive: {
    1024: {
      top: 20
    }
  }
}

Or you can use it to disable the plugin for specific resolutions:

{
  responsive: {
    1024: {
      disable: true
    }
  }
}

So with this the plugin will be disabled below 1024px screen width.