JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="hitTest"></div>
    <div class="infoCloud"></div>
</div>

CSS

.wrapper {
    width: 500px;
    height: 500px;
    background: #ccc;
}

.hitTest {
    position: absolute;
    width: 350px;
    height: 260px;
    background: #000;
}

.infoCloud {
    width: 315px;
    height: 230px;
    background: url(http://pogoria.codivate.pl/templates/karolinka/img/infoCloud.png) no-repeat;
    display: block;
    position: absolute;
    border: 1px red solid;
}

JavaScript

$(".hitTest").click(function() {
    alert('black box hit');
    return false;
});

$('.infoCloud').each(function(i, e) {
    e=$(e);
    e.css('height','201px')
        e.append($(document.createElement('div')).css({height:'30px',border:'1px red solid',marginTop:'201px',background:'url(http://pogoria.codivate.pl/templates/karolinka/img/infoCloud.png) no-repeat scroll -28px -201px',marginLeft:'28px',width:'21px'}));
});