Simply check if your are hover the div when losing focus on your input before hiding it:
$('input').blur(function() {
if(!$('#visible-block').is(":hover"))
$('#visible-block').hide();
});
Edit: After reading the comments, here is the new solution without the need for the blur function:
$(function(){
$('input').focus(function() {
$('#visible-block').show();
});
$('#visible-block').blur(function() {
$('#visible-block').hide();
});
$('html').click(function() {
//Hide the menus if visible
$('#visible-block').hide();
});
$('input').click(function(event){
event.stopPropagation();
});
$('#visible-block').click(function(event){
event.stopPropagation();
});
});
Here is the update jsfiddle