Я пытаюсь встроить опрос SurveyMonkey в модальное окно на моем сайте.Я могу сделать это успешно, за исключением того, что сначала появляется модальный режим, а затем возникает задержка, когда iframe загружает внешний контент (это вызывает эффект мерцания, когда iframe и его содержимое изменяют размер модального окна).
В попытке исправить это, я попытался добавить событие загрузки / готовности, предназначенное для iframe (оно не имеет идентификатора или класса, поэтому мне пришлось согласиться на нацеливание .smcx-iframe-container > iframe
Я думаю, что iframe загружается до того, как событие присоединяется, однако, так как мой модал вообще не загружается после выполнения этой ревизии.
Любая помощь или предложения будут высоко оценены!
Скрипт:
// modal.hide();
(function (t, e, s, n) {
var o, a, c;
t.SMCX = t.SMCX || [], e.getElementById(n) || (o = e.getElementsByTagName(s), a = o[o.length - 1], c = e.createElement(s), c.type = "text/javascript", c.async = !0, c.id = n, c.src = ["https:" === location.protocol ? "https://" : "http://", "widget.surveymonkey.com/collect/website/js/script.js"].join(""), a.parentNode.insertBefore(c, a))
})(window, document, "script", "smcx-sdk");
$('.smcx-iframe-container > iframe').ready(function () {
// modal.show();
});
Сгенерированный источник iframe:
<div class="smcx-widget smcx-embed smcx-show smcx-widget-light">
<div class="smcx-iframe-container">
<iframe width="100%" height="100%" frameborder="0" allowtransparency="true" src="https://www.surveymonkey.com/r/9HWYSDW"></iframe>
</div>
<div class="smcx-widget-footer smcx-embed-footer">
<a class="smcx-branding" href="https://www.surveymonkey.com/user/sign-up/?ut_source=powered_by&ut_source2=new_website_collector"
target="_blank">
<span class="smcx-powered-by">powered by</span>
</a>
</div>
</div>