Javascript 我能';我无法使我的网站平滑滚动

Javascript 我能';我无法使我的网站平滑滚动,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我试图让锚定标签滚动到我的网站部分,但我无法让它工作。这就是我从中获取代码的地方:。我把它复制到它自己的HTML文件中,它工作得很好,所以我不明白为什么它不能在我的网站上工作。 J2产品 击败 |无限的| |阴霾| |自毁| |午夜低音| 最近的 |说我的语言| 付清| 单向| |稀有品种-罗林'| 定价 联系我 $(文档).ready(函数(){ $(#paintsplash').fadeIn(1200)。延迟(3500); }); jQuery(文档).ready(函数($){ $(

我试图让锚定标签滚动到我的网站部分,但我无法让它工作。这就是我从中获取代码的地方:。我把它复制到它自己的HTML文件中,它工作得很好,所以我不明白为什么它不能在我的网站上工作。


J2产品
击败

|无限的|


|阴霾|


|自毁|


|午夜低音|


最近的

|说我的语言|
付清|
单向|

|稀有品种-罗林'|

定价

联系我

$(文档).ready(函数(){ $(#paintsplash').fadeIn(1200)。延迟(3500); }); jQuery(文档).ready(函数($){ $(“.scroll”)。单击(函数(事件){ event.preventDefault(); $('html,body')。设置动画({ scrollTop:$(this.hash).offset().top }, 1000); }); });

锚定
href
是目标
id
。由于您的锚定
href
设置为
#page1
,因此目标是

编辑

选中此项:


|说我的语言|
|付清|
|单程|

|稀有品种-罗林'|

定价

联系我

$(文档).ready(函数(){ $(#paintsplash').fadeIn(1200)。延迟(3500); }); jQuery(文档).ready(函数($){ $(“.scroll”)。单击(函数(事件){ event.preventDefault(); $('html,body')。动画
<head>
    <meta charset="utf-8">
    <title>J2 Productions</title>
    <link rel="stylesheet" type="text/css" href="index.css">
    <link rel="stylesheet" type="text/css" href="parrallax.css">
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script src="index.js"></script>
</head>

<body>
    <div class="parallax">
        <div class="parallax__layer parallax__layer--back">
            <div id="paintsplash">
                <img src="paint_splash.png" height="93%" width="93%" />
            </div>
        </div>
        <div class="parallax__layer parallax__layer--base">
            <div id="middle">
                <div id="services">
                    <div id="s_content">
                        <div id="s_title">
                            <p>Beats</p>
                        </div>
                        <div id="beat1">
                            <p>| Limitless |</p></br>
                            <iframe width="35%" height="150" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/186082426&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>
                        </div>
                        <div id="beat2">
                            <p>| Haze |</p></br>
                            <iframe width="35%" height="150" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/176496757&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>
                        </div>
                        <div id="beat3">
                            <p>| Self-Destruct |</p></br>
                            <iframe width="35%" height="150" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/159969838&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>
                        </div>
                        <div id="beat4">
                            <p>| Midnight Bass |</p></br>
                            <iframe width="35%" height="150" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/162606984&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>
                        </div>
                    </div>
                </div>
                <div id="recent">
                    <div id="r_content">
                        <div id="r_title">
                            <p>Recent</p>
                        </div>
                        <div id="one"> 
                            <a href="https://itunes.apple.com/us/album/one-ep/id984646172">
                                <img src="Front%20Cover.jpg" width="300">
                            </a>
                        </div>
                        <div id="onetxt">
                            <p align="center">
                                | Speaking My Language |
                                <br/>| Pay Up |
                                <br/>| One Way |
                            </p>
                        </div>
                        <div id="rollin"> 
                            <a href="https://itunes.apple.com/us/album/rollin-i-dont-wanna-grow-up/id925559884">
                                <img src="rollin.jpg" width="300">
                            </a>
                        </div>
                        <div id="rollintxt">
                            <p align="center">| Rare of Breed - Rollin' |</p>
                        </div>
                    </div>
                </div>
                <div id="pricing">
                    <div id="p_content">
                        <div id="p_title">
                            <p>Pricing</p>
                        </div>
                        <div id='exclusive'>
                            <img src="Exclusive.png" width="650">
                        </div>
                        <div id="custom">
                            <img src="custom.png" width="650">
                        </div>
                    </div>
                </div>
                <div id="aboutme">
                    <div id="a_content">
                        <div id="a_title">
                            <p>Contact Me</p>
                        </div>
                        <div id="me">
                            <img src="me.png" width='350px' />
                        </div>
                        <div id="email">
                            <img src="contact.png" width="100%" height="600px">
                        </div>
                        <div id="social">
                            <div id="fb"> 
                                <a href="https://www.facebook.com/J2producing">
                                    <img src="facebook.png" width="113px">
                                </a>
                            </div>
                            <div id="tw"> 
                                <a href="https://twitter.com/j2_productionz">
                                    <img src="twitter.png" width="113px">
                                </a>
                            </div>
                            <div id="ig"> 
                                <a href="https://instagram.com/j2productions">
                                    <img src="instagram.png" width="123px">
                                </a>
                            </div>
                            <div id="yt"> 
                                <a href="https://www.youtube.com/channel/UC2Z9nuiZHdU6fN-UfOie6QA">
                                    <img width="123px" src="youtube.png">
                                </a>
                            </div>
                            <div id="gp"> 
                                <a href="https://plus.google.com/u/0/b/100577545228957896103/100577545228957896103/about?hl=en">
                                    <img src="google.png" width="115px">
                                </a>
                            </div>
                            <div id="sc"> 
                                <a href="https://soundcloud.com/j2productions">
                                    <img src="soundcloud.png" width="115px">
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
                <div id="seperators"> 
                    <a id="page1"></a>
                    <div id="page2"></div>
                    <div id="page3"></div>
                    <div id="page4"></div>
                </div>
            </div>
        </div>
    </div>
    <div id="top"> 
        <a href="index.html">
            <img src="J2Productions-text.png" id="logo" draggable="false">
        </a>
        <a href="#page1" class="nav scroll" id="home">BEATS</a>
        <a href="#page2" class="nav scroll" id="beats">RECENT</a>
        <a href="#page3" class="nav scroll" id="contact">PRICING</a>
        <a href="#page4" class="nav scroll" id="about">ABOUT ME</a>
        <img src="line.png" id="line">
    </div>
    <div id="bottom"></div>
    <script src="http://code.jquery.com/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script>
        $(document).ready(function() {
            $('#paintsplash').fadeIn(1200).delay(3500);
        });
    </script>
    <script type="text/javascript">
        jQuery(document).ready(function($) {
            $(".scroll").click(function(event) {
                event.preventDefault();
                $('html,body').animate({
                    scrollTop: $(this.hash).offset().top
                }, 1000);
            });
        });
    </script>
</body>
    <div id ="top">
        <a href="index.html"><img src="J2Productions-text.png" id="logo" draggable="false"></a>
        <a href="#services" class="nav scroll" id="home">BEATS</a>
        <a href="#recent" class="nav scroll" id="beats">RECENT</a>
        <a href="#pricing" class="nav scroll" id="contact">PRICING</a>
        <a href="#separators" class="nav scroll" id="about">ABOUT ME</a>
        <img src="line.png" id="line">
    </div>