如何在jQuery中动画滚动到div？

Question

我一直在尝试研究堆栈溢出的问题已经有一段时间了，但鉴于我并不能真正流利地说 jquery，我似乎无法让它工作。

问题是，如何从页面顶部平滑滚动到 div？我已经设法在 scrollTop 中做到了，但未能将类似的代码应用于我的滚动到 div 代码。

我的作品集网站中有一系列条目，其中包含向下滚动到图库 div 的链接：

$(".button7").click(function() {    
$(".g7").show()
$(window).scrollTop($(".g7").offset().top);
return false;
});

还有html：

<div class="button7">
    <div class="gallery"><br>
    <a href="#" style="cursor:s-resize"><i>gallery</i> &darr;</a></div>
    </div>

<div class="g7"><br><br><br><br><br>
    <img src="Images/7.1.jpg" width="100%" style="display: block;">
    <img src="Images/break.png" width="100%" style="display: block;">
    <img src="Images/7.2.jpg" width="100%" style="display: block;">
    <img src="Images/break.png" width="100%" style="display: block;">
    <img src="Images/7.3.jpg" width="100%" style="display: block;">
    <img src="Images/break.png" width="100%" style="display: block;">
    <img src="Images/7.4.jpg" width="100%" style="display: block;">
    <img src="Images/break.png" width="100%" style="display: block;">
    <img src="Images/7.5.jpg" width="100%" style="display: block;">
    <img src="Images/break.png" width="100%" style="display: block;">
    <img src="Images/7.6.jpg" width="100%" style="display: block;">
    <img src="Images/break.png" width="100%" style="display: block;">
    <br>

    <a href="#" class="scroll" style="cursor:n-resize"><i>back to the top</i> &uarr;</a>
</div>

向上滚动：

$('.scroll').click(function(){
$('html, body').animate({scrollTop : 0},1500);
return false;
});

当单击 .button7 时，我已设法使主体移动到 .g7，但每次尝试为该动作设置动画都失败了。

Answer 1

我的项目中有类似的操作，jquery代码是这样的：

$('html, body').animate({ scrollTop: $('#sonuc_grid').offset().top }, 'slow');

但是要移动到那个 div，你需要给它一个标签索引，如下所示：

<div id="sonuc_grid" tabindex=44></div>

这样浏览器就会知道去哪里