Question

我想在加载页面后滚动到一个div意味着我的起点是特定的div和curser应该指向div.i尝试了几件事，

if ($stateParams.year) {
    console.log("hiop");
    //window.scrollTo(0, 800);
    $(document).scrollTop( $("#scrollToChart").offset().top );
    // $(window).scroll(function(){
    //  $("#scrollToChart").css("margin-top", Math.max(-250, 0 - $(this).scrollTop()));
    // });
    //$('html, body').animate({ scrollTop: $('#scrollToChart').offset().top}, 800);
    //$(window).scrollTop($("#scrollToChart").offset().top).scrollLeft($("#scrollToChart").offset().left);
    //  // $('html,body').animate({scrollTop: 0}, -1000);
    //
    //  //window.scrollTo(0, 800);
    //  //window.onload = scrollToChart();
    //  $(document).ready(function() {
    //      $('html,body').animate({
    //              scrollTop: $(".scrollToChart").offset().top
    //          },
    //          'slow');
    //  });
    //  //$(".scrollToChart").bind('mouseenter', 'scrollTo',);
    // //   $(window).scrollTop($('.scrollToChart').offset().top);
    //
    //  // $(".scrollToChart").ready(function(){
    //  //  $("html, body").delay(2000).animate({
    //  //      scrollTo: $('.scrollToChart').offset().top
    //  //  }, 2000);
    //  // });
}





   <div class="row" id="scrollToChart">
                        <div class="col-md-6 col-sm-6 col-xs-12">
             //content 
                         </div>
   </div>

但问题是当页面正在加载时，光标指向我想要的位置但是在完成加载页面向上滚动之后。任何解决方案？

Answer 1

给它一个旋转：

$(document).ready(function() {
    $('html,body').animate({
        scrollTop: $("#scrollToChart").offset().top
    }, 1000);
});

Answer 2

如果您想按照自己的方式进行操作，那么如果您使用了ID，那么您注释掉的代码就会有效，因为您定位的div没有类...

$('#scrollToChart')代替$('.scrollToChart')

如果你不需要实际的动画滚动，只需使用这个单行...

window.location.href='#scrollToChart'

window.location.href='#scrollToChart'

<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div class="row" id="scrollToChart">scroll to here</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>
<div>stuff</div>

Answer 3

我遇到了问题，问题不是逻辑问题。我在加载时对每个状态更改都调用了scrollTop。并且'滚动到特定div'逻辑在$ rootScope。$ on（'$ stateChangeSuccess'）之前执行。所以我设置了该逻辑的超时并且它工作了!!!

setTimeout(function () {
                scrollToChart();
            },1300);

    var scrollToChart = function () {
        if ($stateParams.year) {

            $(document).ready(function () {
                $('html,body').animate({
                    scrollTop: $("#scrollToChart").offset().top
                }, 1000);
            });

        }
    };

如果某些条件匹配，则在加载页面后滚动到特定的div / height

3 个答案: