在滚动时设置类时iOS会崩溃,其他浏览器都可以

时间:2016-05-15 01:59:15

标签: javascript html css

当窗口滚动到链接容器时,我想更新链接的类。它在某些浏览器上运行良好,但浏览器在iOS上崩溃。

我知道为什么或如何改进这个?

HTML:

<ul id="section-follow" data-default="background-none" data-active="background-red">

  <li class=""><a href="#first">First</a></li>
  <li class=""><a href="#second">Second</a></li>
  <li class=""><a href="#third">Third</a></li>
  <li class=""><a href="#fourth">Fourth</a></li>

</ul>

Javascript:

function SectionFollow() {

  if ($('#section-follow').length) {

    var sections = {},
    _height = $(window).height(),
    i = 0;

    var classDefault = $('#section-follow').attr('data-default');
    var classActive = $('#section-follow').attr('data-active');

    $('.follow').each(function() {

      sections[this.id] = $(this).offset().top;

    });

    var pos = $(this).scrollTop();

    for (i in sections) { // Each section

      if (sections[i] < pos + (_height * .5)) { // 50% from top

        $('#section-follow li a').removeClass(classActive).addClass(classDefault);
        $('a[href="#'+i+'"]').removeClass(classDefault).addClass(classActive); //

        if (history.pushState) { // Update the URL hash

          history.pushState(null, null, window.location.origin + window.location.pathname + window.location.search + $('a[href="#'+i+'"]').attr('href')); // Set the hash using the history api if available to tackle Chromes repaint bug on hash change

        } else {

          window.location.hash = $('a[href="#'+i+'"]').attr('href');

          // Otherwise fallback to the hash update for sites that don't support the history api

        }

      } // End if 50% from the top

    } // End each section

  } // End if section follow exists

} // End SectionFollow

$(window).scroll(function() {

    SectionFollow();

});

0 个答案:

没有答案