JSFiddle - React, Tailwind, and code Playground

by luka kupunia

HTML

<a href="#a">fwef</a>
<a href="#b">fwef</a>
<div id="c">
    <div id="a"></div>
    <div id="b"></div>
</div>

CSS

body {
    scroll-behavior: smooth;
}
#c {
    scroll-behavior: smooth;
}
div {
    scroll-behavior: smooth;
    height: 100vh;
    border: 1px solid black;
}

JavaScript

$("a").on('click', function(event) {
    if (this.hash !== "") {
        event.preventDefault();
        var hash = this.hash;
        var y = $(hash).offset().top - 183;
        console.log(y)
        $('html, body').animate({
            scrollTop: y
        }, 800, function() {});
    }
});
function scrollToAnchor(aid){
  var aTag = $(aid);
    $('html,body').animate({scrollTop: aTag.offset().top - 123},1000);
  }