JSFiddle - React, Tailwind, and code Playground

by Alfie

JavaScript

var p = window.location.href;
p[p.length-1]=="/"?p=p:p=p+"/";
p=p.split("/");
  if (typeof jQuery == "undefined") {
  var jQAnton = document.createElement('script');

jQAnton.setAttribute('src','https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js');
document.head.appendChild(jQAnton);
  }
setTimeout(function(){
if($('.mainAnton').length==0){
 jQuery('<br><br>').insertBefore(jQuery('body').children().first());
 jQuery('<div class="mainAnton"></div>').appendTo('body');
    jQuery('<style>.testAnton{ font-family:Arial,Liberation Sans,DejaVu Sans,sans-serif;font-size:80%;position:relative;height:22px;z-index:10001;color:white !important;vertical-align:middle; }.testAntonContainer{text-decoration:none;float:left; text-align: center;border:1px solid black;}.mainAnton{line-height:22px;position:fixed;left:100px;top:0;background:lightgray;z-index:1001;} .testAnton:hover{background:#525C65 !important;} </style>').appendTo('body');
 p.splice(0, 2);
 color = ["#00688B", "#0099CC", "#3299CC", "#00B2EE", "#00BFFF", "#42C0FB"];

 p.splice(-1, 1);
 for (var i = 0; i < p.length; i++) {

     var link = "http://";
     for (var x = 0; x < i + 1; x++) {
         link = link + p[x] + "/";
     }

     jQuery('<a href="' + link + '"class="testAntonContainer" title="' + p[i] + '"><div class="testAnton">' + p[i] + '</div></a>').css({
         background: color[i]
     }).width(p[i].length * 7).appendTo('.mainAnton');
}
 }},1);