scrolling up and down slowly with JQuery

Question

I have this code for scrolling up and down in Html :

<div id="Response" class="comment"></div>
<br>
<br>
<br>
<br>
<div class="but4 , text15"><a id="Resp" href="#rp">Answer</a></div>

and this code in Jquery :

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script type="text/javascript">
    $("#Resp").click(function () {
        $("html").animate({ scrollTop: $("#Response").offset().top }, 1200);
    });
</script>

but it's not working .. how can I fix this ? I want when I click on answer it scroll to up and go to Response div .

Answer 1

I'd suggest using the ScrollTo plugin instead of rolling your own solution: http://flesler.blogspot.com/2007/10/jqueryscrollto.html

Demo is here: http://demos.flesler.com/jquery/scrollTo/

You can easily specify duration: http://demos.flesler.com/jquery/scrollTo/

EDIT

The solution we came up with in chat is this (not includingscript tags):

$(function () { 
    $("#Resp").click(function () { 
        $("body").scrollTo($("#Response"), 1200); 
    }); 
}); 

Answer 2

This depends on the browser implementation, but you can get it to work in webkit (safari, chrome) and firefox with

$('html, body').animate({ scrollTop: $("#Response").offset().top }, 1200);