javascript - アンダーレイ要素のイベントにアクセスするにはどうすればよいですか?

Question

マップ付きの iframe とマップに重なる別の div を含む div があります。

HTML

<div class="locationFinder">
    <iframe width="100%" height="100%" frameborder="0" scrolling="no"
            marginheight="0" marginwidth="0"
            src="https://maps.google.com/?ie=UTF8&amp;t=m&amp;ll=37.449105,-122.16048&amp;spn=0.003918,0.009634&amp;z=16&amp;output=embed">
    </iframe>

    <div class="mapover">
        <p class="titleTextM">Want to learn more?</p>
    </div>
</div>

CSS

.locationFinder {
    position: relative;
    width: 100%;
    height: 425px;
    background-repeat: no-repeat;
}
.mapover {
    position: absolute;
    top: 0;
    width: 100%;
    height: 428px;
    background-repeat: no-repeat;
    background: black;
    opacity: .5;
}

2 番目の div はオーバー マップです。そのため、操作を実行できません。私の要件は、ユーザーがまだマップを使用できることです。これを達成する方法はありますか？