@davidjbradshaw的 iframe 调整器，iframe 宽度不调整大小

Question

我目前正在一个小部件项目上工作，在该项目中，您可以在上面单击一个按钮，并在上面打开气泡。所有这些都在动态创建的iframe中。我正在使用@davidjbradshaw的iframe-resizer根据内容来调整iframe大小。到目前为止，高度效果非常完美。我的问题是，当我打开气泡后关闭气泡时，iframe的宽度不会调整到原始大小。

这是iframe

中的 html

<div class="content">
<div id="bubble_wrapper" class="bubble_wrapper hide">
    <div id="speech-bubble" class="speech-bubble">
        <div class="widget-content">';
            <p class="introduction" style="font-family:Calibri,Helvetica, Arial, sans-serif; font-size:small;"> intro </p>
            <hr>
            <p class="social-media"> MESSENGERS </p>'
            <div class="providers-imgs">
                <a>..</a>
                <a>..</a>
                <a>..</a>
            </div>
            <hr>
        </div>
    </div>
    <div class="bubble_arrow"></div>
</div>
<div id="logo_wrapper">
    <div id="logo-button" style="background-color:#F1E9F1;">
        <img id="logo" src="/img/o-icon.png" style="width:38px; height:38px;">
    </div>
</div>

这是 javascript 用于显示和隐藏气泡的代码：

document.addEventListener("DOMContentLoaded", function(event) {
var _isMobile = navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPod/i) || navigator.userAgent.match(/Windows Phone/i);
document.getElementsByTagName('head')[0].appendChild(buildHeader());
document.getElementById("content").innerHTML = buildHtml();
addListeners()
function addListeners() {
    var bubble = document.getElementById('bubble_wrapper');
    var logo = document.getElementById('logo');
    logo.addEventListener('click', function() {
        if (_isMobile) logo_wrapper.classList.add('hide')
        if (bubble.classList.contains('hide'))
            bubble.classList.remove('hide')
        else
            bubble.classList.add('hide')
    }, false)

我试图更改EventListener（）中的iframe的宽度，但它不起作用。我也注意到的是，在我关闭气泡之后，iframe宽度仍在保留，因为它仍然包含气泡，当我检查它时，徽标按钮看起来像是边缘右翼，尽管我将保证金设置为0。

在使用iframe-resizer时，有人有相同或类似的问题吗？任何建议，技巧或帮助都将不胜感激。

在这里，该应用程序的屏幕截图，因为它仍然仅在本地运行。https://drive.google.com/a/orat.io/file/d/0b12blltyy7c2tehptnfvmhbhtke/view?usp = sharing

Answer 1

您可以强制从JS调整大小的IFRAME。

myIFrame.iframeResizer.size()

如果那不起作用，那么您的HTML可能问题。