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