网站滚动无法与Chrome SmoothScroll

时间:2018-04-08 23:15:35

标签: javascript html google-chrome smooth-scrolling

所以我的一个朋友问我是否知道为什么他的旧网站(2014年制造)不再工作了。谷歌搜索了一下,我发现它是因为Chrome 61版本默认实现了平滑滚动,如果你尝试加载脚本,它将破坏浏览器的行为。

在他的网站上,我发现他正在使用这个脚本:https://github.com/themicon/smoothscroll/blob/master/smoothscroll.js

他有一个带有一些按钮的菜单,每个按钮都有一行代码如下:

<a href="#about" data-toggle="collapse" data-target=".navbar-collapse">ABOUT US</a>

它应该带来一行看起来像这样的代码:

<section id="about">
         <div class="container">
            <div class="row">
         </div>
            </div>
</section>

该网站仍然可以与Firefox和其他浏览器完美配合,所以我不知道我是否需要更改,我试图搜索脚本的更新版本,也许作者修复了问题并发现了这个:

https://github.com/galambalazs/smoothscroll-for-websites/blob/master/SmoothScroll.js

正如您所注意到的,该脚本已经很长时间没有更新,事实上,即使最新版本在Chrome 61版本更新之前也是如此,所以我怀疑这会解决问题。

在网站的最后,这些是加载的脚本:

  <!-- Bootstrap --> 
  <script src="js/jquery-1.11.0.min.js"></script> 
  <script src="js/bootstrap.min.js"></script> 
  <!-- Animation --> 
  <script type="text/javascript" src="js/animation/jquery.appear.js"></script>        
  <!-- AJAX Contact Form -->          
  <script type="text/javascript" src="js/contact/contact-form.js"></script>
  <!-- Lightbox --> 
  <script src="lightbox/ekko-lightbox.js"></script>       
  <!-- Isotope -->     
  <script src="js/isotope/jquery.isotope.min.js"></script>
  <script src="js/isotope/custom-isotope.js"></script>
  <!-- Slider Revolution 4.x Scripts -->
  <script type="text/javascript" src="rs-plugin/js/jquery.themepunch.plugins.min.js"></script>
  <script type="text/javascript" src="rs-plugin/js/jquery.themepunch.revolution.js"></script>
  <script>
     var revapi;

          jQuery(document).ready(function() {

                 revapi = jQuery('.tp-banner').revolution(
                  {
                          delay:9000,
                          startwidth:1170,
                          startheight:500,
                          fullScreen:"on",
                          forceFullWidth:"on",
                          minFullScreenHeight:"320",
                          videoJsPath:"rs-plugin/videojs/"
                  });

          }); //ready
  </script>
  <!-- Custom -->
  <script src="js/custom.js"></script> 
  <!-- Parallex -->
  <script src="js/parallex/script.js"></script> 
  <!-- ScrollTo -->
  <script src="js/nav/jquery.scrollTo.js"></script> 
  <script src="js/nav/jquery.nav.js"></script> 
  <!-- Sticky -->
  <script type="text/javascript" src="js/sticky/jquery.sticky.js"></script>
  <!-- Donut Chart --> 
  <script type="text/javascript" src="js/progress-bars/jquery.donutchart.js"></script> 
  <script>
     $("#donutchart1").donutchart("animate");
     $("#donutchart2").donutchart("animate");
     $("#donutchart3").donutchart("animate");
     $("#donutchart4").donutchart("animate");
     $("#donutchart5").donutchart("animate");
     $("#donutchart6").donutchart("animate");
     $("#donutchart7").donutchart("animate");
     $("#donutchart8").donutchart("animate");         
  </script>        
  <!-- Owl Carousel --> 
  <script src="owl-carousel/owl-carousel/owl.carousel.js"></script>
  <!-- SmoothScroll --> 
    <script type="text/javascript" src="js/SmoothScroll/SmoothScroll.js"></script>
  <!-- Retina --> 
    <script type="text/javascript" src="js/retina/retina.js"></script>
    <!-- FitVids -->
    <script type="text/javascript" src="js/jquery.fitvids.js"></script>

0 个答案:

没有答案