Scrolltop animation locking scroll

Question

I have a form with multiple fields. In each field, the page scroll to bottom

$('.my_input').on('change', function(e){
    $("html, body").animate({ scrollTop: $("html, body").height()}, "slow");
}

This works fine, but if i try to scroll to top, the page "freeze" the scroll in bottom, releasing after several attemps.

How to fix it?

Tks

Answer 1

Maybe the event is firing itself again and again. You can try using one to fire the event only once.

See the code below. Also please share sufficient code to replicate the problem, if this doesn't help you as their maybe another reason for the problem.

 $(document).ready(function(){ $('.my_input').one('change', function(e){ $("html, body").animate({ scrollTop: $("html, body").height()}, "slow"); }); }); 

 .my_input{ display:block; margin-bottom:300px; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="text" class="my_input"/> <input type="text" class="my_input"/> <input type="text" class="my_input"/>