Scroll page to top in jquery load function

Question

What I tried:

$('#content').load("/education.php?filter_page=kurs&selected_kurs_id=" + selectedKursId + "&selected_category_id=" + selectedCategoryId  + "&kursId=" + positionKurs, function(){
     $(this).scrollTop(0);

});

How to scroll page up after content load?

Answer 1

 $(document).ready(function(){ $('html, body').animate({scrollTop:0}, 'slow'); });

 .wrapper{ height: 1000px; border: 1px solid #ccc; padding: 5px; }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="wrapper"><h3>Header</h3>

Answer 2

Do You really need to use jQuery (for example to have an animation)?

If You do, try:

$('html,body').scrollTop(0);

OR

$('html, body').animate({ scrollTop: 0 }, 'fast');

if you want a little animation instead of a snap to the top.

On the other hand, if You don't need jQuery simply use Javascript

window.scrollTo(x-coord, y-coord); e.g. window.scrollTo(0, 0)

Parameters:

x-coord is the pixel along the horizontal axis.

y-coord is the pixel along the vertical axis.

Answer 3

It's my experience that you need to delay the scrolling after loading or it won't do anything. Try this:

$('#content').load("/education.php?filter_page=kurs&selected_kurs_id=" + selectedKursId + "&selected_category_id=" + selectedCategoryId  + "&kursId=" + positionKurs, function(){
     settimeout(function()
     {
         $('#content').scrollTop(0);
     }, 100);

});

Answer 4

Try the same .load as you posted:

$('#content').load("/education.php?filter_page=kurs&selected_kurs_id=" + selectedKursId + "&selected_category_id=" + selectedCategoryId  + "&kursId=" + positionKurs);

BUT

Inside education.php add:

<script>
    $("html, body").animate({ scrollTop: 0 }, "slow");
</script>