进入视图javascript时为每个类元素运行一个函数

问题描述

当主页是所有项目的滚动时,我正在尝试建立一个投资组合网站。 我给项目的所有标题一个固定位置,显示“无”,我想将其更改为仅在项目部分进入视口时显示“块”。

代码有效!但仅适用于所有标题的最后一个类元素:(

这就是我写的,我很感激任何帮助!

  var isInViewport = function (elem) {
      var bounding = elem.getBoundingClientRect();
      return (
          bounding.top >= 0 &&
          bounding.left >= 0 &&
          bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
          bounding.right <= (window.innerWidth || document.documentElement.clientWidth)
      );
  };


var projects = document.getElementsByClassName("proj");
for (x=0; x<projects.length; x++){
  var proj = projects[x];
  var head = proj.querySelector('.head');

  console.log(proj);
  window.addEventListener('scroll',function (event) {
      if (isInViewport(proj)) {
          head.style.display = "block"
      } else {
          head.style.display = "none"
          console.log(head);
      };
    },false);
  };

谢谢!

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)