Question

我的jQuery遇到了一些问题，并且正在寻找一些解决方案来为我现有的slideDown函数添加一些内容。

对我来说非常有趣的是2010年http://stackoverflow.com/questions/4034659/is-it-possible-to-animate-scrollop-with-jquery

的问题/答案

与该问题的不同之处在于，我每次都在寻找scrollTop的解决方案<a> anchor。

在下面的示例中，<a href"#">可能会移至顶部。

这可能吗？

HTML

<div class="next_btn" id="next_btn_show_step_3">
    <a href="#"><?php echo $lang ['next']; ?></a>
</div>
<article class="order_form_step_3" id="banner_step_3">
</article>

的jQuery

$(document).ready(function(){
  $("#banner_step_3").hide();

  $("#next_btn_show_step_3").click(function(e){
    $("#banner_step_3").slideDown(500);
    e.preventDefault();
  });
});

Answer 1

您可以轻松地调整这样的答案：

$("html, body").animate({ scrollTop: Math.floor($('#yourElement').offset().top) + "px" });

Answer 2

<强> jquery的

$('.next_btn a').on('click', function(e) {//on link click
    var th = $(this);//get element
    th.parent().next('article').slideDown(500);//slide down
    $('html, body').animate({ scrollTop: th.offset().top }, 500);//scrollto link
    e.preventDefault();//prevent default
});

我可以在不编写函数的情况下使用scrollTop吗？

2 个答案: