Scrolling goes all over the place?

I have Jquery code on my page that should make the page scroll to a few things but also make the page scroll to a particular div. For some reason, the scrolling is all over the place and it never scrolls to the actual div. Could this be a bug?

jQuery( document ).ready(function($) {
   $(function(){
     
     // when button 1 is clicked
        $('.module1Btn').click(function(){
     			 // scroll div with id #menuSlider to top of viewport      
           $('html, body').animate({scrollTop: $('#menuSlider').offset().top}, 'slow');
      		//set module1Btn as active and others inactive     
           $('.module1Btn').addClass('moduleBtnActive');
           $('.module2Btn').removeClass('moduleBtnActive');
           $('.module3Btn').removeClass('moduleBtnActive');
					// and show module 1, hide others
           $('.module1').addClass('showModule');
           $('.module2').removeClass('showModule');
           $('.module3').removeClass('showModule');
         });
					// when button 2 is clicked
     		 $('.module2Btn').click(function(){
     			 // scroll div with id #menuSlider to top of viewport                
         $('html, body').animate({scrollTop: $('#menuSlider').offset().top}, 'slow');
					// set button 2 to active
         $('.module2Btn').addClass('moduleBtnActive');
         $('.module1Btn').removeClass('moduleBtnActive');
         $('.module3Btn').removeClass('moduleBtnActive');
					// and show module 2, hide others
         $('.module2').addClass('showModule');
         $('.module1').removeClass('showModule');
         $('.module3').removeClass('showModule');
        });     
// when button 3 is clicked
		     $('.module3Btn').click(function(){
     			 // scroll div with id #menuSlider to top of viewport                
					
         $('html, body').animate({scrollTop: $('#menuSlider').offset().top}, 'slow');
					// set button 3 to active
         $('.module3Btn').addClass('moduleBtnActive');
         $('.module1Btn').removeClass('moduleBtnActive');
         $('.module2Btn').removeClass('moduleBtnActive');
// and show module 3, hide others
         $('.module3').addClass('showModule');
         $('.module2').removeClass('showModule');
         $('.module1').removeClass('showModule');
        });         
    });  
});

Hello Tristan,

Thanks for writing in! Be advised that custom jQuery coding or any custom development is beyond the scope of our support under our Support Policy. If you are unfamiliar with code and resolving potential conflicts, you may select our One service for further assistance.

I would highly recommend to get further assistance from the one who coded the jQuery or hide a 3rd party developer to be able to resolve your issue.

Thank you for your understanding.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.