javascript - 添加动画以向下滚动到 jquery 中的特定 div

Question

你好，我正在使用以下代码滚动到特定 div 的底部，它工作正常但是速度太快，我希望它缓慢滚动到特定元素，我知道我可以做到jquery 和我几个小时以来一直在尝试不同的代码，任何人都可以就我的代码帮助我，谢谢。

<script>
$(document).ready(function(){
$(".cat-anchor").click(function(){
    $('html','body').animate({scrollTop: $(".cat-title").offset.top},'slow');
});
});
</script>

<div class="bran-cat">
        <h2>Category</h2>
        <div class="cat-list">
            <?php
                foreach($cat_arr['cat_pro'] as $cat_name){
                    echo "<a class='cat-anchor'>".">".$cat_name[1]."</a> <br>";
                }
                //$sel_cat= $wpdb->get_results("SELECT * FROM ");
            ?>
        </div>
</div>
<?php

    foreach($cat_arr['cat_pro'] as $mykey=>$myvalues){
       echo '<div name="'.$myvalues[1].'" class="cat-title" id="'.$myvalues[0].'"><h2>'.$myvalues[1].'</h2></div>';
?>

Answer 1

要滚动到指定元素，请使用 jQuery animate() .

$('body').animate({
  scrollTop: $('#target-element').offset().top
}, 500);

最后一个参数是动画的持续时间。