JSFiddle - React, Tailwind, and code Playground

by fparent

HTML

<link rel="stylesheet" href="http://pixelcakecreative.com/cimlife/wp-content/themes/cimlife-theme/style.css">
<div id="navBar">
            <div class="menu-nav-container"><ul class="menu" id="menu-nav"><li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-4 current_page_item menu-item-23" id="menu-item-23"><a href="http://pixelcakecreative.com/cimlife/">Home</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-19" id="menu-item-19"><a href="http://pixelcakecreative.com/cimlife/about/">About</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-20" id="menu-item-20"><a href="http://pixelcakecreative.com/cimlife/teams/audience-management/">Our Teams</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-21" id="menu-item-21"><a href="http://pixelcakecreative.com/cimlife/careers/">Careers</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-22" id="menu-item-22"><a href="http://pixelcakecreative.com/cimlife/blog/">Blog</a></li>
</ul></div>            <div id="dropdown" style="display: none; opacity: 0.692792;"><div class="menu-teams-container"><ul class="menu" id="menu-teams"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-159" id="menu-item-159"><a href="http://pixelcakecreative.com/cimlife/teams/audience-management/">Audience Management</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-153" id="menu-item-153"><a href="http://pixelcakecreative.com/cimlife/teams/business-intelligence/">Business Intelligence</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-162" id="menu-item-162"><a href="http://pixelcakecreative.com/cimlife/teams/finance/">Finance</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-155" id="menu-item-155"><a...

CSS

div {
    width:100%; height:   
}

JavaScript

$('#menu-item-20').bind('mouseenter', function () {
    $("#dropdown").stop(true, true).fadeIn(500);
});
$('#dropdown').bind('mouseleave', function () {
    $("#dropdown").stop(true, true).fadeOut(500);
});