[英]Why isn't my anchor tag smooth scrolling?
I have added this in the head 我已经在脑子里加了
<script type="text/javascript" src="js/index.js"></script>
This is the link that navigates to the 'id="fillerSix"' div tag. 这是导航到'id =“ fillerSix”'div标签的链接。
<h1><a href="#fillerSix">Mohammad Usman Khan</a></h1>
This is id="fillerSix" which the link should and does navigate to. 这是id =“ fillerSix”,链接应该并且确实导航到该链接。
<div id="fillerSix" class="fillerSix">
This is my index.js file 这是我的index.js文件
<script type="text/javascript">
$('a[href*="#"]:not([href="#"])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
|| location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
</script>
The link works, in that it directs the user to the anchor but there is no smooth scrolling. 该链接起作用,因为它将用户定向到锚点,但是没有平滑的滚动。
Your block in index.js
should probably be wrapped in $(document).ready( function(){ /* your code here */ });
您在index.js
块可能应该包装在$(document).ready( function(){ /* your code here */ });
as indicated by DanielD above. 如上文DanielD所述。
Likewise you do NOT need <script></script>
tags inside of a .js
file. 同样,您不需要.js
文件中的<script></script>
标记。 This will lead to a parse error. 这将导致解析错误。
New contents of index.js
: index.js
新内容:
$(document).ready( function(){
$('a[href*="#"]:not([href="#"])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
|| location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.