JSFiddle - React, Tailwind, and code Playground

by Ian Roberts

HTML

<div id="top"></div>
<a href="#spaceone" >spaceone</a>
<a href="#spacetwo" >spacetwo</a>
<a href="#spacethr" >spacethr</a>
<a href="#spacefou" >spacefou</a>
<a href="#spacefiv" >spacefiv</a>
<div id="spaceone"><a href="#top" >top</a></div>
<div id="spacetwo"><a href="#top" >top</a></div>
<div id="spacethr"><a href="#top" >top</a></div>
<div id="spacefou"><a href="#top" >top</a></div>
<div id="spacefiv"><a href="#top" >top</a></div>

CSS

#spaceone, #spacetwo, #spacethr, #spacefou, #spacefiv {
    height:400px;
    background:#fad400;
}

JavaScript

//smooth scroll works in all browsers, desktop & mobile
// via - http://www.dwuser.com/education/content/quick-guide-adding-smooth-scrolling-to-your-webpages/

// smoothscroll.js needs to be fired below 'addClass' to hashbangs script here is the script to load http://www.dwuser.com/education/content/quick-guide-adding-smooth-scrolling-to-your-webpages/assets/smoothscroll.js

// add class to a tags with hashbangs href
$('a[href*="#"]').each(function() {
    $('a').addClass('smoothScroll');
});

/**
 * SmoothScroll
 * This helper script created by DWUser.com.  Copyright 2012 DWUser.com.  
 * Dual-licensed under the GPL and MIT licenses.  
 * All individual scripts remain property of their copyrighters.
 * Date: 10-Sep-2012
 * Version: 1.0.1
 */
if (!window['jQuery']) alert('The jQuery library must be included before the smoothscroll.js file.  The plugin will not work propery.');

/**
 * jQuery.ScrollTo - Easy element scrolling using jQuery.
 * Copyright (c) 2007-2012 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
 * Dual licensed under MIT and GPL.
 * @author Ariel Flesler
 * @version 1.4.3.1
 */
;(function($){var h=$.scrollTo=function(a,b,c){$(window).scrollTo(a,b,c)};h.defaults={axis:'xy',duration:parseFloat($.fn.jquery)>=1.3?0:1,limit:true};h.window=function(a){return $(window)._scrollable()};$.fn._scrollable=function(){return this.map(function(){var a=this,isWin=!a.nodeName||$.inArray(a.nodeName.toLowerCase(),['iframe','#document','html','body'])!=-1;if(!isWin)return a;var b=(a.contentWindow||a).document||a.ownerDocument||a;return/webkit/i.test(navigator.userAgent)||b.compatMode=='BackCompat'?b.body:b.documentElement})};$.fn.scrollTo=function(e,f,g){if(typeof f=='object'){g=f;f=0}if(typeof g=='function')g={onAfter:g};if(e=='max')e=9e9;g=$.extend({},h.defaults,g);f=f||g.duration;g.queue=g.queue&&g.axis.length>1;if(g.queue)f/=2;g.offset=both(g.offset);g.over=both(g.over);return this._scrollable().each(function(){if(e==null)return;var...