SO - 22834307

HTML

<div id="overlay">
<div id="home_text">
    <!-- your image -->
</div>
</div>

CSS

#overlay {
background: rgba(0, 0, 0, .4);
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: 10;
}

#home_text {
background: red;
height: 300px;
margin: 20px auto 0;
width: 300px;
}

JavaScript

$(document).ready(function() {
        var overlay = $('#overlay');
        overlay.on('click', function (e) {
            overlay
                .hide()
                .off();
        });
    });