javascript - 更多/更少的影响

Question

他们如何在下面提供的网站上制作“告诉我更多”效果。我读过 read more/less effect in jQuery，但我发现该站点的有趣之处在于，除非单击该按钮，否则无法滚动页面。

Effect link

Answer 1

希望这段代码对您的效果有所帮助。

$('button').click(function(){
  $("body").addClass("scroll");
  $('html, body').animate({
      scrollTop: $(".goto").offset().top
  }, 500);
});

body{
  margin: 0;
  height: 1000px;
  overflow: hidden;
}
body.scroll{
  overflow: auto;
}
.goto{
  margin-top: 500px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<button>Goto section</button>
<div class="goto">
Section
</div>