Question

我想知道是否可以在6秒后向下滚动到锚点？

我发现这个脚本向下滚动了几个像素，但它并不完全是我想要的。

<script type='text/javascript'>
     setTimeout("window.scrollBy(0,270);",6000);
</script>

另外如何让它顺利向下滚动？我找到了这个但是如何将它与其他脚本结合起来？

function scrollToAnchor(aid) {
     var aTag = $("a[name='" + aid + "']");
     $('html,body').animate({scrollTop: aTag.offset().top},'slow');
}

$("#link").click(function() {
     scrollToAnchor('id3');
});

我对JS不太熟悉所以我真的很感激一些帮助：）

我工作的网站是：kip.mascomm.be

更新：

我得到了第一部分工作，感谢Seth，但是有人可以给我一个代码来使表现顺利：

var delay = 1000 * 10;
    setTimeout(function() {
        location.hash = "#kippenkramen";
    }, delay);

Answer 1

时间延迟示例：

var delay=1000 * 6;//1*6 seconds
setTimeout(function(){
  //window.scrollTo(500, 0);//scrolls to specific location
  //location.hash = "#elmentid"; //scrolls to element with given id
},delay);

（How to set time delay in javascript）

动画滚动功能：

function scrollTo(element, to, duration) {
  if (duration < 0) return;
  var difference = to - element.scrollTop;
  var perTick = difference / duration * 10;

  setTimeout(function() {
    element.scrollTop = element.scrollTop + perTick;
    if (element.scrollTop == to) return;
    scrollTo(element, to, duration - 10);
  }, 10);
}

（Cross browser JavaScript (not jQuery...) scroll to top animation）

Answer 2

  document.querySelectorAll('a[href]').forEach( el => {
    el.onclick = (e) => {
      e.preventDefault()
      setTimeout(() => {
        window.location = el.getAttribute('href')
      }, 6000);
    }
  })

几秒钟后向下滚动到锚点

2 个答案: