Javascript 外部iFrame隐藏，直到窗口调整大小_Javascript_Google Chrome_Dom_Shopify

Javascript 外部iFrame隐藏，直到窗口调整大小

javascript google-chrome dom shopify

Javascript 外部iFrame隐藏，直到窗口调整大小,javascript,google-chrome,dom,shopify,Javascript,Google Chrome,Dom,Shopify,编辑：进一步检查使我认为这是Chrome/Firefox/Edge Mac的问题。在Windows、Android和iOS上都可以。它看起来像是Javascript引入的iFrame将其高度设置为0px，只有当您调整窗口大小时，Chrome才会“唤醒”并将其调整为更合适的大小，以便显示iFrame内容我们在Webflow电子商务商店中使用Shopify的“购买按钮”，但是在这种情况下，除非调整窗口大小，否则某些Shopify按钮/价格不会显示在桌面上（Chrome、Firefox、Edge）

编辑：进一步检查使我认为这是Chrome/Firefox/Edge Mac的问题。在Windows、Android和iOS上都可以。它看起来像是Javascript引入的iFrame将其高度设置为0px，只有当您调整窗口大小时，Chrome才会“唤醒”并将其调整为更合适的大小，以便显示iFrame内容

我们在Webflow电子商务商店中使用Shopify的“购买按钮”，但是在这种情况下，除非调整窗口大小，否则某些Shopify按钮/价格不会显示在桌面上（Chrome、Firefox、Edge）

以下是我相信在页面加载时会发生的事情：

Shopify按钮脚本在价格中运行

此特定页面使用脚本将一个集合移动到另一个集合中

这个脚本运行时，可能会对Shopify隐藏外部iFrame

Chrome/Firefox/Edge无法查看这些“移动”项目的价格

我花了一整天寻找解决办法。看起来很可能是外部iFrame的问题。我正在大声思考几个想法：

移除iFrame
延迟脚本加载，直到集合移动脚本完成
加载后调整iFrame的大小以“轻推它”

下面是一个示例页面（转到第4页，查看问题）：

以下是我使用的Shopify按钮代码：


/**/