top of page

Add and Remove Class from a section on Scroll

  • Writer: سُلَيْمَان بْن دَاوُوْد
    سُلَيْمَان بْن دَاوُوْد
  • Aug 28, 2020
  • 1 min read

jQuery(document).ready(function () {
    
    $(document).scroll(function() {
      var scrolled    = $(document).scrollTop(); 
      var bannerht    = $('.inner-banner').height();
      var content     = $('.blog-detail-content').height();

      var p = $( '.blog-detail-text' ).first();
      var position = p.position();
     

      var leftcontentwidth  = $('.blog-detail-text').width();
      var stickysidebarwidth = parseInt(leftcontentwidth) + parseInt(position.left) + 50;



      $('.sticky').css('left', stickysidebarwidth);
      $('.sticky').css('right', 0);
      
      if(scrolled > bannerht){
        $('.amaxra-sidebar').addClass('sticky');

      }

      if(scrolled < bannerht || scrolled > content){
        $('.amaxra-sidebar').removeClass('sticky');

      }


    })
});


Recent Posts

See All
Hide Upcoming Events

Hiding Upcoming Events can be relatively useful when you are using ACF fields to show Dates for an an Event The Following Snippet is an...

 
 
 

Comments


© 2020 by syednazrulhassan

bottom of page