Show/Hide Box on click in inputa

Show/Hide Box on click in inputa

HTML

<div class="container">
    <label for="myInput">Click in input</label>
    <input type="text" class="js-input" id="myInput" />
    <div class="toggleBox">
        Some information
    </div>
</div>

CSS

.container {
    position: relative;
}

.toggleBox {
    position: absolute;
    top: -99999px;
    left: 99999px;
    padding: 15px;;
    border: 1px solid black;
}

JavaScript

$('.js-input').click(function(e) {
    $('.toggleBox').show();
    $('.toggleBox').css({
        top : 12 + 'px',
        left : 91 + 'px'
    });
  
     e.stopPropagation();
});
$('.toggleBox').click(function(e){
     $(this).show();   
    e.stopPropagation();
});
   
$(document).click(function(){
    $('.toggleBox').hide();
});