JSFiddle - React, Tailwind, and code Playground

by Geo George

HTML

<div id="app">
    <span data-show="b" @click="scrollToSection">B</span>
    <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sodales sit amet lectus quis interdum. Mauris hendrerit, purus vitae vulputate pharetra, enim mauris consectetur nulla, ut sollicitudin magna turpis in erat. Integer eleifend ac nulla rhoncus aliquam. Nam consectetur magna vel semper pulvinar. Fusce sagittis tempus lacus, eu ullamcorper elit. Nullam euismod in justo eget mollis. In condimentum neque sit amet ligula tincidunt tempor. Integer cursus nisl a quam gravida, vitae convallis ipsum auctor. Donec ipsum justo, sollicitudin ut nunc bibendum, fringilla dignissim metus. Maecenas bibendum iaculis dictum. Ut rutrum sapien eget metus fringilla, vel consectetur metus ultrices. Vestibulum convallis vitae lorem non accumsan. Nam non felis dolor. Duis vitae libero molestie metus feugiat sollicitudin ac vel metus.
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sodales sit amet lectus quis interdum. Mauris hendrerit, purus vitae vulputate pharetra, enim mauris consectetur nulla, ut sollicitudin magna turpis in erat. Integer eleifend ac nulla rhoncus aliquam. Nam consectetur magna vel semper pulvinar. Fusce sagittis tempus lacus, eu ullamcorper elit. Nullam euismod in justo eget mollis. In condimentum neque sit amet ligula tincidunt tempor. Integer cursus nisl a quam gravida, vitae convallis ipsum auctor. Donec ipsum justo, sollicitudin ut nunc bibendum, fringilla dignissim metus. Maecenas bibendum iaculis dictum. Ut rutrum sapien eget metus fringilla, vel consectetur metus ultrices. Vestibulum convallis vitae lorem non accumsan. Nam non felis dolor. Duis vitae libero molestie metus feugiat sollicitudin ac vel metus.
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sodales sit amet lectus quis interdum. Mauris hendrerit, purus vitae vulputate pharetra, enim mauris consectetur...

JavaScript

new Vue({
    el: '#app',
    data: {
        scrollPosition: 0,
    },
    methods: {
      scrollToSection:function(e){
      		var targetElement=e.target.dataset.show;
          var selectedElement=document.getElementById(targetElement);
      		var elementTop = selectedElement.offsetTop;
          window.scrollBy({
            top: elementTop,
            behavior: 'smooth'
          });
      }
	}
});