JSFiddle - React, Tailwind, and code Playground

by Macavity

HTML

<li class=""><a href="#page-contact" id="scrollButton">Contact</a></li>


<section id="page-contact" class="page-contact">
</section>

CSS

.page-contact {
    border: 1px solid red;
    height: 50px;
    margin-top:1000px;
}

JavaScript

$('#scrollButton').on('click', function(event) {
        var target = $(this.hash);
        if( target.length ) {
            event.preventDefault();    
            $('html, body').animate({
                scrollTop: target.offset().top
            }, "slow");
        }
    });