Собственно, сабж.
Текущий код умеет:
При нажатии на кнопку ОК (#mc-embedded-subscribe) вылезает попап с одним из двух div'ов (#mce-error-response или #mce-success-response) (эта часть кода храниться на сервере, предоставляющем API).
Вместе с этими дивами вылезает блок, который затемняет весь background (#modal-bg).
При клике вне попапа он закрывается. Как сделать, чтобы вместе с ним закрывался и затемняющий background блок? И как можно красиво переписать существующий JS код?
Большое спасибо.
<div id="mce-responses">
<div id="mce-error-response" style="display:none" ></div>
<div id="mce-success-response" style="display:none"></div>
</div>
<div id="modal-bg" style="display:none">
<input type="submit" value="ОК" id="mc-embedded-subscribe" onClick="show();">
<script>
function show(){
document.getElementById('modal-bg').style.display = 'block';
}
window.onload = function () {
document.onclick = function (e) {
e = e || window.event;
if((e.target || e.srcElement).id != 'mce-success-response') {
document.getElementById('mce-success-response').style.display = 'none';
}
if((e.target || e.srcElement).id != 'mce-error-response') {
document.getElementById('mce-error-response').style.display = 'none';
}
}
}