0

我有一个导航 div，我想用它来导航到我的 html 页面上的不同幻灯片。我想使用动画滚动顶部动画到不同幻灯片的每个单独的 id。我根据我阅读的一些 stackoverflow 帖子和我在网上找到的教程编写了一个函数，但由于某种原因它不起作用。

    <!DOCTYPE HTML>
    <html>
    <head> 
    <meta http-equiv="content-type" content="text/html;charset=UTF-8">
    <title>Home - Kevin Waldmann</title>
    <script src="//code.jquery.com/jquery-latest.min.js" type="text/javascript"><script>
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <script type="text/javascript" src="js/script.js"></script>
    <script>
    function navScroll(navId)
    {
        $('html, body').animate({
            scrollTop: $(navId).offset().top}, 2000);
    }
    </script>
    </head>
    <body>
    <div id="navbar">
    <div id="navList">
    <div class="navItem unselectable" onclick="navScroll('#slide1')">Home</div>
    <div class="navItem unselectable" onclick="navScroll('#slide2')">Education</div>
    <div class="navItem unselectable" onclick="navScroll('#slide3')">Work Experience</div>
    <div class="navItem unselectable" onclick="navScroll('#slide4')">Skills</div>
    <div class="navItem unselectable" onclick="navScroll('#slide5')">Links</div>
    <div class="navItem unselectable" onclick="navScroll('#slide6')">Greek Life</div>
    <div class="navItem unselectable" onclick="navScroll('#slide7')">Volunteering</div>
    <div class="navItem unselectable" onclick="navScroll('#slide8')">Contact</div>
    </div>
    </div>

    <div id="pageContent">
        <div class="contentSpace"></div>
        <div class="contentPane" id="slide1"></div>
        <div class="contentSpace"></div>
        <div class="contentPane" id="slide2"></div>
        <div class="contentSpace"></div>
        <div class="contentPane" id="slide3"></div>
        <div class="contentSpace"></div>
        <div class="contentPane" id="slide4"></div>
        <div class="contentSpace"></div>
        <div class="contentPane" id="slide5"></div>
        <div class="contentSpace"></div>
        <div class="contentPane" id="slide6"></div>
        <div class="contentSpace"></div>
        <div class="contentPane" id="slide7"></div>
        <div class="contentSpace"></div>
        <div class="contentPane" id="slide8"></div>

    </div>
    </div>

    </body>
    </html>

<

4

1 回答 1

0

我不得不改变

    <script src="//code.jquery.com/jquery-latest.min.js" type="text/javascript"><script>

至

    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"><script>
于 2013-10-03T01:08:14.720 回答