JSFiddle - React, Tailwind, and code Playground

by maharajan a

HTML

<div class="option">One</div>
<div class="option">Two</div>
<div class="option">
    <div id="container">
        <div class="onHover">Three
            <div class="showMenu">
                <a href="#">Link 1</a></br>
                <a href="#">Link 2</a></br>
                <a href="#">Link 3</a></br>
            </div>
        </div>
    </div>
<div class="option">Four</div>
<input type="text" />
<div class="option">Five</div>

CSS

.option {
    display: inline;
}

#container {
    display: inherit;
        position:relative;
}

.onHover {
    display: inline;

}

.showMenu {
    display: none;
  
}

.onHover:hover .showMenu {
    display: block;
     position: absolute;
     left:0px;
     top:20px;
     width:100px;
}

JavaScript

$('input').keyup(function() {

alert($(this).length)
});