时间戳

首页 > 解决方案 > 为scrollTop添加延迟？

javascript - 为scrollTop添加延迟？

问题描述

是否可以严格在下面的代码中为 scrollTop 函数添加延迟？

function btns(evt, btnName) {
  var i, containerMain, tablinks; 
  containerMain = document.getElementsByClassName("containerMain");
  tablinks = document.getElementsByClassName("tablinks");
  for (i = 0; i < containerMain.length; i++) {
    containerMain[i].classList.remove('active');
  }
  for (i = 0; i < tablinks.length; i++) {
    tablinks[i].classList.remove('active');
  }
  document.getElementById(btnName).classList.add('active');
  evt.currentTarget.classList.add('active');
  for (i = 0; i < containerMain.length; i++) {
    containerMain[i].scrollLeft = 0;
    containerMain[i].scrollTop = 0;
  }
}

标签： javascript

解决方案

setInterval当所有元素都滚动时，您也可以使用和清除计时器。

function btns(evt, btnName) {
  var i, containerMain, tablinks; 
  containerMain = document.getElementsByClassName("containerMain");
  tablinks = document.getElementsByClassName("tablinks");
  for (i = 0; i < containerMain.length; i++) {
    containerMain[i].classList.remove('active');
  }
  for (i = 0; i < tablinks.length; i++) {
    tablinks[i].classList.remove('active');
  }
  document.getElementById(btnName).classList.add('active');
  evt.currentTarget.classList.add('active');
  for (i = 0; i < containerMain.length; i++) {
    containerMain[i].scrollLeft = 0;
  }
  i=0;
  const timer = setInterval(() => {
    containerMain[i++].scrollTop = 0;
    if(i >= containerMain.length) clearInterval(timer);
  }, 1000);
}

推荐阅读