javascripthtmljquerysmooth-scrollinginstant

JQuery scrolling speed to be instantaneous please


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>

Solution

  • 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})