ScrollTop Javascript在Firefox中不起作用

时间:2016-02-26 05:08:44

标签: javascript firefox

我的导航栏无法正常使用ScrollTop Javascript。它适用于Chrome和Safari,但不适用于Firefox。

这是我目前在网站上的所有代码。一旦导航栏位于页面顶部,我希望导航栏跟随滚动。请在Firefox中查看,因为我遇到了这个问题!

HTML

<body>

  <div class="container">
    <nav class="bottom" id="nav">
      <div class="buttonWrapper">
        <a href="#about">
          <div class="navButton">About</div>
        </a>
        <a href="#designs">
          <div class="navButton">Designs</div>
        </a>
        <a href="#contact">
          <div class="navButton">Contact</div>
        </a>
      </div>
    </nav>
    <div class="largeLogo"></div>
  </div>
  <div class="container about" id="about">
    <div class="sideBar about">
      <div class="sidebarText"></div>
      <p></p>
    </div>
  </div>

  <div class="container designs" id="designs">
    <div class="view view-ninth">
      <img src="images/11.jpg" />
      <div class="mask mask-1"></div>
      <div class="mask mask-2"></div>
      <div class="content">
        <h2>Hover Style #9</h2>
        <p>Some Text</p>
        <a href="#" class="info">Read More</a>
      </div>
    </div>
    <div class="sideBar designs">
      <div class="sidebarText"></div>
    </div>
  </div>

  <div class="container contact" id="contact">
    <div class="sideBar contact">
      <div class="sidebarText"></div>
    </div>
  </div>

</body>

的JavaScript

$(function() {
  $('a[href*="#"]:not([href="#"])').click(function() {
    if (location.pathname.replace(/^\//, '') === this.pathname.replace(/^\//, '') && location.hostname === this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
      if (target.length) {
        $('html, body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
  });
});

window.addEventListener("scroll", navTop, false);

function navTop() {
  var nav = document.getElementById("nav");
  var about = document.getElementById("about").offsetTop - 1;
  if (document.body.scrollTop > about) {
    nav.className = "minimize";
  } else {
    nav.className = "bottom";
  }
}

Fiddle

1 个答案:

答案 0 :(得分:1)

问题在于for($i = 1; $i <= $pagecount; $i++){ $tplId = $mpdf->ImportPage($i); $size = $mpdf->getTemplateSize($tplId); $mpdf->_setPageSize(array($size['w'], $size['h']), 'P'); $mpdf->AddPage(); $mpdf->useTemplate($tplId); $mpdf->SetWatermarkText('http://www.bps.go.id','0.07'); $mpdf->watermark_font='Arial Black'; $mpdf->showWatermarkText = true; } 。尝试使用以下代码:

document.body.scrollTop

function navTop() { var nav = document.getElementById("nav"); var about = document.getElementById("about").offsetTop - 1; var scrollTop = $(document).scrollTop(); if (scrollTop > about) { nav.className = "minimize"; } else { nav.className = "bottom"; } } / $(document).scrollTop();适用于Firefox和Chrome