繁体   English   中英

Scrollspy-在导航上单击Chrome滚动,IE和FF不会

[英]Scrollspy - on nav click Chrome scrolls, IE & FF doesn't

单击导航栏可在Chrome中正确滚动页面,而在FF和IE中则没有任何反应。 任何想法? 这是我的导航jsx的一部分:

handleOnClick (e) {
    e.preventDefault();
    if (this.props.show) {
        var target = $(e.target.parentElement);
        var el = $('#section-' + this.props.id);
        $('.list-group-item').removeClass('active');
        $('.scrollspy').removeClass('scrollspy-active');
        target.addClass('active');
        $('body').animate(
            {scrollTop: (el.offset().top - 20)},
            {
                duration: 200,
                done: () => {
                    $('.scrollspy').addClass('scrollspy-active'); 
                }
            });
        this.props.onSelected(e, this.props.id);
        if ($(window).width() <= 992) {
            $('.collapse').collapse('hide');
        }
    }
};

更新:这是我的nav.html。 如果太多,请原谅我。 论坛上说,以前关于FF和IE的问题一直被反复提及,但似乎并非如此。

<div class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container">

      <!-- Main navigation -->
      <ul class="nav navbar-nav">
        {% for nav_item in nav %}
        {% if nav_item.children %}
        <li class="dropdown{% if nav_item.active %} active{% endif %}">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">{{ nav_item.title }} <b class="caret"></b></a>
          <ul class="dropdown-menu">
            {% for nav_item in nav_item.children %}
            {% include "nav-sub.html" %}
            {% endfor %}
          </ul>
        </li>
        {% else %}
        <li {% if nav_item.active %}class="active"{% endif %}>
          <a href="{{ nav_item.url }}">{{ nav_item.title }}</a>
        </li>
        {% endif %}
        {% endfor %}
      </ul>
      {% endif %}
      <ul class="nav navbar-nav navbar-right">
        {% if repo_url %}
        <li>
          <a href="{{ repo_url }}">
            {% if repo_name == 'GitHub' %}
            <i class="fa fa-github"></i>
            {% elif repo_name == 'Bitbucket' %}
            <i class="fa fa-bitbucket"></i>
            {% endif %}
            {{ repo_name }}
          </a>
        </li>
        {% endif %}
      </ul>
    </div>

这是关于改变

$('body').animate(

$('html,body').animate(

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM