【问题标题】:How to Scroll Down - JQuery如何向下滚动 - JQuery
【发布时间】:2012-09-29 05:22:29
【问题描述】:

我不是程序员,但我使用下面的代码将页面滚动到顶部。

如何调整它以向下滚动?

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>

<a class="btnMedio" href="javascript:;">
    <img src="http://desmond.imageshack.us/Himg41/scaled.php?server=41&filename=deixeseuemail.png&res=landing"/>
</a>

<script>
    $('.btnMedio').click(function(){
        $('html, body').animate({scrollTop:1000},'50');
    });
</script>

【问题讨论】:

    标签: javascript jquery


    【解决方案1】:
    $('.btnMedio').click(function(event) {
        // Preventing default action of the event
        event.preventDefault();
        // Getting the height of the document
        var n = $(document).height();
        $('html, body').animate({ scrollTop: n }, 50);
    //                                       |    |
    //                                       |    --- duration (milliseconds) 
    //                                       ---- distance from the top
    });
    

    【讨论】:

    • 感谢您的帮助 我如何控制页面下降的距离?
    • @user1301037 您可以将n 替换为您想要的任何值,也可以使用offset 方法。
    • 如何滚动到特定的元素 ID?
    • @GeorgeRappel 可以使用jQuery offset 方法获取元素的顶部偏移量,并使用返回值代替n
    【解决方案2】:

    试试这个:

    window.scrollBy(0,180); // horizontal and vertical scroll increments
    

    【讨论】:

    • OP 提到了一个 jQuery 解决方案。
    • OP 可能假设为此需要 jQuery。这个答案可能会有所帮助。
    • 这很好用。我们也可以添加动画吗?
    【解决方案3】:

    这个可以用来解决这个问题

    <div id='scrol'></div> 
    

    在javascript中使用这个

    jQuery("div#scrol").scrollTop(jQuery("div#scrol")[0].scrollHeight);
    

    【讨论】:

      【解决方案4】:

      我主要使用以下代码向下滚动

      $('html, body').animate({ scrollTop:  $(SELECTOR).offset().top - 50 }, 'slow');
      

      【讨论】:

        【解决方案5】:

        如果你想向下滚动到 div (id="div1")。然后,您可以使用此代码。

         $('html, body').animate({
             scrollTop: $("#div1").offset().top
         }, 1500);
        

        【讨论】:

          【解决方案6】:
              jQuery(function ($) {
                  $('li#linkss').find('a').on('click', function (e) {
                      var
                          link_href = $(this).attr('href')
                          , $linkElem = $(link_href)
                          , $linkElem_scroll = $linkElem.get(0) && $linkElem.position().top - 115;
                      $('html, body')
                          .animate({
                              scrollTop: $linkElem_scroll
                          }, 'slow');
                      e.preventDefault();
                  });
              });
          

          【讨论】:

          • 你能解释一下你的答案吗?
          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2017-04-04
          • 2014-02-04
          • 1970-01-01
          • 1970-01-01
          • 2013-08-23
          • 1970-01-01
          相关资源
          最近更新 更多