JQuery scrolling speed to be instantaneous please

259 Views Asked by At

I would like my JQuery scrolling speed to be instantaneous (not smooth/not fast but instant like a classic anchor href="#"). It seems to be about the queue but how could I change my script please ? Thanks for your help.

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>
3

There are 3 best solutions below

1
Ben On BEST ANSWER

Thank you for your answers. Changing that parameter didn't change stuffs for me. I've followed the advice of quantumPuter about scrollIntoView and it worked (finally no JQuery needed. I added the terms "href="#openmenu" onclick="window.location.hash = '#menu1'"" to prove we can combine other stuffs together and makes that scroll still working).

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>

Also, to answer my question, making JQuery scrolling instant (it's about the queue like i thought) =>

$('html,body').animate({scrollTop: e.offset().top},{queue: false,duration: 0})
0
Florent On

Replace 'fast' by 0. The second parameter is duration in milisecond

<script>
function scrolling(aid){
var aTag = $("a[name='"+ aid +"']");
$('html,body').animate({scrollTop: aTag.offset().top},0);}
$("#link").click(function() {
scrolling('here');});
</script>
0
AudioBubble On

Instead of using fast replace it by something like 0.2 using only 0 doesn't seem to work so a super small close to 0 value would do the trick.