Javascript jQuery平滑滚动定位问题
我对jQuery非常陌生,正在尝试在我的web项目上实现平滑滚动到div。出于某种原因,当我创建一个新的基本html测试页面并添加用于滚动的js时,它就工作了。然而,当我将完全相同的代码导入主项目时,它实际上并没有滚动,而是在稍微停顿后直接跳转到预期的div。我不知道为什么它会在测试页面上工作,而不是在我的实际项目中。有人知道是什么导致它这样做的吗?任何帮助都将不胜感激!谢谢 我在head中定义了以下脚本:Javascript jQuery平滑滚动定位问题,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我对jQuery非常陌生,正在尝试在我的web项目上实现平滑滚动到div。出于某种原因,当我创建一个新的基本html测试页面并添加用于滚动的js时,它就工作了。然而,当我将完全相同的代码导入主项目时,它实际上并没有滚动,而是在稍微停顿后直接跳转到预期的div。我不知道为什么它会在测试页面上工作,而不是在我的实际项目中。有人知道是什么导致它这样做的吗?任何帮助都将不胜感激!谢谢 我在head中定义了以下脚本: <script src="http://ajax.googleapis.com/a
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script src="js/script.js"></script>
是在
下面是代码
HTML:
jQuery:
$(document).ready(function(){
$('a[href^="#"]').on('click',function (e) {
e.preventDefault();
var target = this.hash,
$target = $(target);
$('html, body').stop().animate({
'scrollTop': $target.offset().top
}, 900, 'swing', function () {
window.location.hash = target;
});
});
});
我已经在创建了一个快速JSBin,也许您可以添加一些其他代码,看看它是否仍能像预期的那样工作,然后我可以帮助诊断这个问题。另一种选择可能是尝试将其插入,看看它是否与您的代码一起工作。
$(document).ready(function(){
$('a[href^="#"]').on('click',function (e) {
e.preventDefault();
var target = this.hash,
$target = $(target);
$('html, body').stop().animate({
'scrollTop': $target.offset().top
}, 900, 'swing', function () {
window.location.hash = target;
});
});
});
<section id="splash">
<div class="banner"></div>
<div id="mainContent">
<div id="intro">
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<a href="#productInfo">LEARN MORE</a>
</div>
</div>
</section>
<div id="productInfo">test tests</div>
#productInfo { background:gray; color:#000; margin-top:400px; padding:10px; height:1000px;}
$(document).ready(function(){
$('a[href^="#"]').on('click',function (e) {
e.preventDefault();
var target = this.hash,
$target = $(target);
$('html, body').stop().animate({
'scrollTop': $target.offset().top
}, 900, 'swing', function () {
window.location.hash = target;
});
});
});