Tooltip v1

HTML

<script src="http://vadikom.com/demos/poshytip/src/jquery.poshytip.js"></script>
<link rel="stylesheet" href="http://vadikom.com/demos/poshytip/src/tip-darkgray/tip-darkgray.css">
<div>
<label for="example">Text:</label>
<input class="example" name="example" type="text" maxlength="100" />
    <div class="tip">
        Some text...
    </div>
</div>

<div>
<label for="example">Text:</label>
<input class="example" name="example" type="text" maxlength="100" />
    <div class="tip">
        Some text...
    </div>
</div>

CSS

.tip{
 background: tomato;
 color: #fff;
 padding: 20px;
}

JavaScript

$('.example').on('blur', function() {
    $('div.tip').fadeOut('medium');
});
$('.example').on('focus', function() {
    $(this).siblings('div.tip').fadeIn( "slow");
});
$('div.tip').hide();