JQuery 滚动速度请为瞬时
JQuery scrolling speed to be instantaneous please
我希望我的 JQuery 滚动速度是 即时的 (不是 smooth/not 快,而是像经典锚点 href="#" 一样即时)。这似乎与队列有关,但请问我该如何更改我的脚本?感谢您的帮助。
https://jsfiddle.net/7f1Ldeqr/
<div style="height:3000px">
<a href="#" id="link">Down</a>
<a name="here" style="position:relative; top:2000px;"></a>
</div>
<script src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.js'></script>
<script>
function scrolling(aid){
var aTag = $("a[name='"+ aid +"']");
$('html,body').animate({scrollTop: aTag.offset().top},'fast');}
$("#link").click(function() {
scrolling('here');});
</script>
将'fast'替换为0,第二个参数为毫秒持续时间
<script>
function scrolling(aid){
var aTag = $("a[name='"+ aid +"']");
$('html,body').animate({scrollTop: aTag.offset().top},0);}
$("#link").click(function() {
scrolling('here');});
</script>
而不是使用 fast 将其替换为 0.2 之类的东西,仅使用 0 似乎不起作用,因此接近 0 的超小值可以解决问题。
感谢您的回答。更改该参数并没有改变我的东西。我听从了 quantumPuter 关于 scrollIntoView 的建议并且它起作用了(最后没有 JQuery 需要。我添加了术语“href="#openmenu" onclick="window.location.hash = '#menu1'"" 以证明我们可以将其他内容组合在一起并使滚动仍然有效)。
https://jsfiddle.net/7k1s6t80/
<div style="height:3000px">
<a id="forscroll" href="#openmenu" onclick="window.location.hash = '#menu1'">Down</a>
<a id="here" style="position:absolute; top: 2000px;"></a>
</div>
<script>
const target = document.getElementById('here'),
button = document.getElementById('forscroll');
button.addEventListener('click',
function(){target.scrollIntoView({block: 'start',behavior:'instant',inline:'start'});});
</script>
此外,为了回答我的问题,使 JQuery 即时滚动(就像我想的那样关于队列)=>
$('html,body').animate({scrollTop: e.offset().top},{queue: false,duration: 0})
我希望我的 JQuery 滚动速度是 即时的 (不是 smooth/not 快,而是像经典锚点 href="#" 一样即时)。这似乎与队列有关,但请问我该如何更改我的脚本?感谢您的帮助。
https://jsfiddle.net/7f1Ldeqr/
<div style="height:3000px">
<a href="#" id="link">Down</a>
<a name="here" style="position:relative; top:2000px;"></a>
</div>
<script src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.js'></script>
<script>
function scrolling(aid){
var aTag = $("a[name='"+ aid +"']");
$('html,body').animate({scrollTop: aTag.offset().top},'fast');}
$("#link").click(function() {
scrolling('here');});
</script>
将'fast'替换为0,第二个参数为毫秒持续时间
<script>
function scrolling(aid){
var aTag = $("a[name='"+ aid +"']");
$('html,body').animate({scrollTop: aTag.offset().top},0);}
$("#link").click(function() {
scrolling('here');});
</script>
而不是使用 fast 将其替换为 0.2 之类的东西,仅使用 0 似乎不起作用,因此接近 0 的超小值可以解决问题。
感谢您的回答。更改该参数并没有改变我的东西。我听从了 quantumPuter 关于 scrollIntoView 的建议并且它起作用了(最后没有 JQuery 需要。我添加了术语“href="#openmenu" onclick="window.location.hash = '#menu1'"" 以证明我们可以将其他内容组合在一起并使滚动仍然有效)。
https://jsfiddle.net/7k1s6t80/
<div style="height:3000px">
<a id="forscroll" href="#openmenu" onclick="window.location.hash = '#menu1'">Down</a>
<a id="here" style="position:absolute; top: 2000px;"></a>
</div>
<script>
const target = document.getElementById('here'),
button = document.getElementById('forscroll');
button.addEventListener('click',
function(){target.scrollIntoView({block: 'start',behavior:'instant',inline:'start'});});
</script>
此外,为了回答我的问题,使 JQuery 即时滚动(就像我想的那样关于队列)=>
$('html,body').animate({scrollTop: e.offset().top},{queue: false,duration: 0})