Scroll to top after Ajax content load - php

Question

Is there anyway that I can make it so the page will automatically scroll to the top after the content has loaded (via Ajax)?
This is the code I have for displaying the content:
$(document).ready(function () {
var my_layout = $('#container').layout();
$("a.item_link").click(function () {
$("#loader").fadeIn();
feed_url = $(this).attr("href");
$.ajax({
type: "POST",
data: "URL=" + feed_url,
url: "view.php",
success: function (msg) {
$("#view-area").html(msg);
$("#loader").fadeOut();
}
});
return false;
});
});
So after the 'view-area' has loaded its content can I make the page auto scroll to the top?

Answer 1

Just use the scroll function
scrollTo(0);
If you want the jquery, then here is a good example with smoothing :)
From the link:
$('html, body').animate({ scrollTop: 0 }, 0);
//nice and slow :)
$('html, body').animate({ scrollTop: 0 }, 'slow');
To put it in your code
...
success: function (msg) {
$("#view-area").html(msg);
$("#loader").fadeOut();
//Put code here like so
$('html, body').animate({ scrollTop: 0 }, 0);
}

Answer 2

You can do $(window).scrollTop(0);

Answer 3

All ajax requests have a callback argument so use scrollTop(0).
Check the jQuery documentation on how to use ajax callbacks.

Answer 4

If you have no callback, try to bind an event listener:
document.addEventListener(
"load",
function(event) {
event.composedPath().forEach(function(dom) {
if (dom.classList && dom.classList.value === "classOfLoadedContent") {
$(".div-to-be-scrolled").scrollTop($(".content").innerHeight());
}
});
},
true
);