JSFiddle - React, Tailwind, and code Playground

by Alexandru Gatea

JavaScript

jQuery(document).ready(function($) {
  'use strict';
  // add class to navbar in for creating opening/ closing effects
  var navbar = $('#website-navigator'),
    navToggler = $('#mobile-nav-toggler');

  navToggler.on('click', function() {
    if (!navbar.hasClass('is-opened')) {
      navbar.addClass('is-opened');
      $('body').css('overflow', 'hidden');
    } else {
      navbar.removeClass('is-opened');
      $('body').css('overflow', 'auto');
    }
  });

  var scroll = new SmoothScroll(document, 50, 10);
  var pos = window.scrollY;


  // scroll to anchor
  $(document).on('click', 'a[data-scroll^="#"]', function(e) {
    if ($(this).attr('data-scroll') !== "") {
      e.preventDefault();
      var hash = $(this).attr('data-scroll');
      $('html, body').animate({
        scrollTop: $(hash).offset().top,
      }, 600, 'swing', function() {
        pos = target.scrollTop
      });
    }
  });



  function SmoothScroll(target, speed, smooth) {
    if (target === document)
      target = (document.scrollingElement || document.documentElement || document.body.parentNode || document.body)
    // cross browser support for document scrolling
    var moving = false
    //pos = target.scrollTop
    var frame = target === document.body && document.documentElement ? document.documentElement : target // safari is the new IE

    target.addEventListener('mousewheel', scrolled, {
      passive: false
    })
    target.addEventListener('DOMMouseScroll', scrolled, {
      passive: false
    })
    target.addEventListener('scroll', scrolled, {
      passive: false
    })

    function scrolled(e) {
      e.preventDefault(); // disable default scrolling
      var delta = normalizeWheelDelta(e)
      pos += -delta * speed
      pos = Math.max(0, Math.min(pos, target.scrollHeight - frame.clientHeight)) // limit scrolling

      if (!moving)
        update()
    }

    function normalizeWheelDelta(e) {
      if (e.detail) {
        if (e.wheelDelta)
          return...