0

I load a page with ajax and I want main page to auto scroll to the beginning of loaded page. Here is the code I use:

html

<button class="btn btn-info btn-lg" type="button" id="photos"> <i class="fa fa-plus fa-5x"></i><br>Add Photo</button>

and at the bottom of the page I have this js code

$(document).ready(function(){
$("#photos").click(function(){
    $(".content-loader").fadeOut('slow', function()
    {
        $(".content-loader").fadeIn('slow');
        $(".content-loader").load('somepage.php?pid=3');
    });
});

The above works fine and page 'somepage.php?pid=3' is loaded in <div class="content-loader">. How can I make the page to autoscroll to <div class="content-loader"> when page 'somepage.php?pid=3' is loaded?

Nikos
  • 15
  • 6
  • 1
    Possible duplicate of [jQuery scroll to element](https://stackoverflow.com/questions/6677035/jquery-scroll-to-element) – Liam Jul 21 '17 at 15:15
  • Just wrap the above in the success call back of `load()` – Liam Jul 21 '17 at 15:16
  • also bear in mind [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) – Liam Jul 21 '17 at 15:16

1 Answers1

0

the following should work for the .load() function. It should scroll on load complete

$(".content-loader").load('somepage.php?pid=3', function () {
  $('html,body').animate({scrollTop: $(".content-loader").offset().top});
});
J. Chen
  • 357
  • 1
  • 7