【问题标题】:jQuery scroll to div onclick not workingjQuery滚动到div onclick不起作用
【发布时间】:2017-10-16 02:29:42
【问题描述】:

我正在尝试在我的网站http://www.dicosoftware.com 上实现滚动到 div,以便平滑滚动到网站的每个部分,但它不起作用。您可以到该站点进行验证,任何可以提供的反馈将不胜感激。

我在 main.js 文件下使用以下 jQuery 函数。

 $(".js--scroll-to-main").click(function(){
    $('html,body').animate({scrollTop:$("#header").offset().top},2000);
 });

 $(".js--scroll-to-about_us").click(function({
    $('html,body').animate({scrollTop:$("#sectionabout_us").offset().top},2000;
 });

 $(".js--scroll-to-services").click(function(){
      $('html, body').animate({scrollTop:$("#section-services").offset().top},2000);
 });

 $(".js--scroll-to-contact_us").click(function(){
      $('html, body').animate({scrollTop:$("#section-contact_us").offset().top},2000);
 });

我的链接设置在无序列表下

<ul class="main-nav hidden js--main-nav">
    <li> <a class="js--scroll-to-main" href="#">Inicio</a> </li>
    <li> <a class="js--scroll-to-about_us" href="#">Nosotros</a> </li>
    <li> <a class="js--scroll-to-services" href="#">Servicios</a> </li>
    <li class="contact-link"> <a class="js--scroll-to-contact_us" href="#">Contactanos</a> </li>
</ul>

每个部分都设置在以下 div 下。

 <header id="header"> ... </header>
 <section class="section-about_us js--section-about_us" id="section-about_us"> ... </section>
 <section class="section-services js--section-services" id="section-services"> ... </section>
 <section class="section-contact js--section-contact" id="section-contact_us"> ... </section>

【问题讨论】:

    标签: javascript jquery html jquery-animate scrolltop


    【解决方案1】:

    注意控制台中的错误:

    TypeError: $('html, body').animate is not a function.

    在类似的question 中指出,jQuery 的精简版本不包含很多功能。

    您应该将下面的脚本更改为完整版的 jQuery:

    &lt;script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"&gt;&lt;/script&gt;

    如:

    https://code.jquery.com/jquery-3.1.1.min.js

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2014-09-06
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多