How to control the placement of a div with position fixed?

1

How can I make it so that when my right div gets to the comment area div it gets fixed again? When it arrives at an X number of distance from the top I apply a position fixed for it to follow the content: Link of the stuff

 <script type="text/javascript">
            $(document).ready(function () {
                $(window).scroll(function () {
                    if ($(this).scrollTop() > 630) {
                        $('.paginas-especiais-post').css({
                            position: 'fixed',
                            top: '60px'
                        });
                    } else {
                        $('.paginas-especiais-post').css({
                            position: 'relative',
                            top: '0'
                        });
                    }
                });
            });
        </script>

    
asked by anonymous 27.07.2015 / 19:55

1 answer

2

I found an alternative to your problem that was to add one more restriction in if:

&& $(this).scrollTop() < $('.comentarios-pag').position().top - 630

If the scroll is greater than 641 and less than the distance of the comment div by subtracting the size (plus some spaces eg navbar and paddings).

Abs.

$(document).ready(function() {
    $(window).scroll(function() {
        var especiais = $('.paginas-especiais-post');

        if( $(this).scrollTop() > 641 && $(this).scrollTop() < $('.comentarios-pag').position().top - 630 ) {
          especiais.css({
            position: 'fixed',
            top: '60px'
          });
        } else {
          especiais.css({
            position: 'relative',
            top: '0'
          });
        };
    });
});
    
27.07.2015 / 21:45