無法使scrollTo jQuery效果正常工作

Question

我在實現“ 一頁導航”和“ ScrollTo” jQuery插件時遇到了問題（似乎我需要更高的聲譽才能發布鏈接，所以希望您知道我指的是哪個插件）。 我是Java語言的完全初學者，我只希望導航欄的鏈接具有滾動效果，如此處所示。

我已經在下面粘貼了我的html頁面的整個代碼，因為我不確定我哪里出錯了。 現在，我已經從兩個插件中保留了ready函數（盡管我只嘗試了一個-並嘗試將其附加到'div＃nav'，'＃navbar'等）。

    <html>

    <head>

        <meta charset="utf-8">

        <title>deepeedesigns - Portfolio site of Web Designer Dan Pierce</title>

        <link rel="icon" type="image/png" href=""><!--favicon-->

        <meta name="description" content=""><!--description that appears under Google listing-->

       <meta name="keywords" content="">

       <meta name="robots" content="">

       <link rel="stylesheet" type="text/css" href="css/stylesheet.css">

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

   </head>

    <body>

    <div id="header">

        <div class="container">

            <div id="navbar">

                <div id="logo"><img src="images/logo.png"></div>

                    <ul id="nav">
                        <li><a href="#home">Home</a></li>
                        <li><a href="#about">About</a></li>
                        <li><a href="#portfolio">Portfolio</a></li>
                        <li><a href="#contact">Contact</a></li>
                    </ul>

            </div><!--navbar-->  

        </div><!--container-->

    </div><!--header-->

    <div id="home">

        <div class="background">

            <div class="container">


            </div><!--container-->

        </div><!--background-->

    </div><!--home-->

    <div id="about">

        <div class="background">

            <div class="container">


            </div><!--container-->

        </div><!--background-->

    </div><!--about-->

    <div id="portfolio">

        <div class="background">

            <div class="container">


            </div><!--container-->

        </div><!--background-->

    </div><!--portfolio-->

    <div id="contact">

        <div class="background">

            <div class="container">


            </div><!--container-->

        </div><!--background-->

    </div><!--contact-->

    $(document).ready(function() {
  $('#nav').onePageNav();
});

$(document).ready(function() {
  $('#nav').$scrollTo();
});

</body>

</html>

Answer 1

jQuery的<script>和</script>標記在哪里？

更新：

為什么要兩次聲明$(document).ready ？

    $(document).ready(function() {
      $('#nav').onePageNav();
      $('#nav').scrollTo();
    });

Answer 2

您不需要使用Jquery滾動頂部。 您可以在window對象上使用它

  window.scrollTo(0,0);

但是，如果您想制作動畫或要對特定元素執行滾動，則可以使用jquery

   $("html, body").animate({ scrollTop: 0 }, "slow");

在您的代碼中，您必須在<script></script>標記內編寫JavaScript代碼。 有一個scrollTo而不是$scrollTo的拼寫錯誤

返回頁首鏈接

HTML

 <a class="btn-go-top" href="javascript:window.scrollTo(0,0);">Go to top</a>

CSS

.btn-go-top {
    position:fixed;
    bottom: 20px;
    right: 20px;
}

無法使scrollTo jQuery效果正常工作

問題描述

2 個解決方案

解決方案1
1 2014-04-22 10:55:03

解決方案2
0 已采納 2014-04-22 10:56:51

無法使scrollTo jQuery效果正常工作

問題描述

2 個解決方案

解決方案1 1 2014-04-22 10:55:03

解決方案2 0 已采納 2014-04-22 10:56:51

解決方案1
1 2014-04-22 10:55:03

解決方案2
0 已采納 2014-04-22 10:56:51