Skip to content
This repository has been archived by the owner on Sep 11, 2022. It is now read-only.

HOW TO: Stick element to parent container? #257

Open
ghost opened this issue May 22, 2017 · 2 comments
Open

HOW TO: Stick element to parent container? #257

ghost opened this issue May 22, 2017 · 2 comments

Comments

@ghost
Copy link

ghost commented May 22, 2017

Hi!
HOW TO: Stick element to parent container?

<div class="col-md-12">
   <div class="col-md-8">
      <div class="menu" id="sticky"></div>
   </div>
</div>

And how to stick element to col-md-12 class?

@Tsiftelis-Thanasis
Copy link

Hi! i am having the same issue, any update?
Thanks!

@kytosai
Copy link

kytosai commented Dec 15, 2017

Guide: You can change core sticky file to use bottomSpacing with function to check destination point pause sticky

Edit file sticky.js file: http://prntscr.com/hnrb6e
Change old line

var newTop = documentHeight - s.stickyElement.outerHeight()
            - s.topSpacing - s.bottomSpacing - scrollTop - extra;

To

 // EDIT
          var newTop =  documentHeight - s.stickyElement.outerHeight()
            - s.topSpacing - scrollTop - extra;

          if (typeof s.bottomSpacing === 'function') {
            newTop = newTop - s.bottomSpacing();
          }else {
            newTop = newTop - s.bottomSpacing;
          }
          // END EDIT

Use new config bottomSpacing with function check end point: http://prntscr.com/hnrcd3

$('#examp-sticky').sticky({
        bottomSpacing: function(){
          return $('html').height() - $('.fake-end-point').offset().top;
        },
      });

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants