Javascript 函数scrollIntoView不'；行不通

我的函数

scrollIntoView

有点问题。事实上，它不起作用：(

这是我的代码：

• HTML

  <section class="page_mission">
    <div class="page_mission_text">
      <div class="scroll-animations">
        <div class="animated fadeInLeft">
          <h2>Design <i class="fab fa-css3-alt"></i><i class="fab fa-html5"></i></h2>
          <p>Blablabla<br></p>
        </div><hr style="width: 75%;">
        <div class="animated">
          <h2>Modernité <i class="fas fa-dna"></i></h2>
          <p>Blablabla</p>
        </div><hr style="width: 75%;">
        <div class="animated">
          <h2>Coûts <a href="cost_popup.html" class="ajax-popup-link"><i class="far fa-credit-card"></i></a></h2>
          <p>Blablabla</p>
        </div>
      </div>
    </div>
  </section>
  

  
  设计
  布拉布拉布拉
  
  
  摩登尼特
  喋喋不休
  
  
  科茨
  喋喋不休
  
  

• JS

  $(document).ready(function() {
     function isScrolledIntoView(elem) {
         var docViewTop = $(window).scrollTop();
         var docViewBottom = docViewTop + $(window).height();
  
         var elemTop = $(elem).offset().top;
         var elemBottom = elemTop + $(elem).height();
  
         return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
      }
  
      $(window).scroll(function() {
          $('.scroll-animations .animated').each(function() {
              if (isScrolledIntoView(this) === true) {
                  $(this).addClass('fadeInLeft');
  
              }
      });
  });
  

  $（文档）.ready（函数（）{
  函数IsCrolledinToView（elem）{
  var docViewTop=$（window.scrollTop（）；
  var docViewBottom=docViewTop+$（window）.height（）；
  var elemTop=$（elem）.offset（）.top；
  var elemBottom=elemTop+$（elem）.height（）；
  返回（（elemBottom=docViewTop））；
  }
  $（窗口）。滚动（函数（）{
  $（'.scroll animations.animated'）。每个（函数（）{
  if（isScrolledIntoView（此）==true）{
  $（this.addClass（'fadeInLeft'）；
  }
  });
  });
  

有人知道怎么了吗？

---

非常感谢！

在我看来，

fadeInLeft

类正在按预期添加到scroll上。但是，您确实需要额外的右括号和右括号来关闭文档就绪事件处理程序：

$(document).ready(function() {

  function isScrolledIntoView(elem) {

  var docViewTop = $(window).scrollTop();

  var docViewBottom = docViewTop + $(window).height();

  var elemTop = $(elem).offset().top;

  var elemBottom = elemTop + $(elem).height();

  return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
  }

  $(window).scroll(function() {

    $('.scroll-animations .animated').each(function() {

      if (isScrolledIntoView(this) === true) {

        $(this).addClass('fadeInLeft');

      }

    });
  });

}); // This was missing

$（文档）.ready（函数（）{
函数IsCrolledinToView（elem）{
var docViewTop=$（window.scrollTop（）；
var docViewBottom=docViewTop+$（window）.height（）；
var elemTop=$（elem）.offset（）.top；
var elemBottom=elemTop+$（elem）.height（）；
返回（（elemBottom=docViewTop））；
}
$（窗口）。滚动（函数（）{
$（'.scroll animations.animated'）。每个（函数（）{
if（isScrolledIntoView（此）==true）{
$（this.addClass（'fadeInLeft'）；
}
});
});
})这个不见了

您还需要确保在JavaScript执行之前加载jQuery。最简单的方法是在页面的

元素中放置类似的内容：

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

什么不起作用？当你运行你拥有的东西时会发生什么？控制台窗口是否显示任何错误？是的，有一个错误：未捕获的引用错误：$未在（索引）：153处定义，当我运行时，什么也没有发生：/你能发布与行号153一致的代码吗？对不起。代码是“$（文档）。准备好了吗（function（）{“我的JS代码的第一行感谢您的回答，但是在修改之后，出现了足够多的问题。我的控制台中有此错误；未捕获引用错误：$未在（索引）中定义）：153您必须确保在脚本运行之前加载jQuery。这就是JSFIDLE工作的原因。它会在运行页面的其余部分之前自动拉入jQuery。我如何确保我的jQuery代码已加载？谢谢您的回答：）@当然可以。这取决于页面。最简单的方法是在页面的

标题中包含类似的内容：