Monacaでアプリ開発を行う場合、iframe を利用してコンテンツを表示させる機会があると思います。
Monacaで利用されているCordovaは、アプリ起動時に iframe を使った処理を行なっています。
そのため、アプリ起動時にコンテンツ側でも iframe を使って外部サイトを表示させている場合、Cordova 側の iframe 処理と競合して、スプラッシュ画像が表示されたままの状態になることがあります。
この状態を回避するためには、iframe タグで外部サイトを表示させるのではなく、JavaScript から iframe オブジェクトを作成して、表示位置に追加する等の対策が必要になります。
例1
<script>
window.addEventListener('load', function() {
var iframe = document.createElement("iframe");
iframe.src = "https://ja.monaca.io";
iframe.style.width = "100%";
iframe.style.height = "100%";
var element = document.querySelector("body");
element.appendChild(iframe);
}, false);
</script>
<body>
<!-- iframe src="https://ja.monaca.io" / -->
</body>
Onsen UI の場合
Onsen UIを利用している場合は、下記のように ons-page の .page__content に追加する必要があります。
例2
<script>
document.addEventListener('init', function(event) {
var page = event.target;
if (page.matches('#page1')) {
var iframe = document.createElement("iframe");
iframe.src = "https://ja.monaca.io";
iframe.style.width = "100%";
iframe.style.height = "100%";
var element = document.querySelector("#page1 > .page__content");
element.appendChild(iframe);
}
});
</script>
<body>
<ons-page id="page1">
<!-- iframe src="https://ja.monaca.io" / -->
</ons-page>
</body>
おわりに
iframe を利用している場合で、アプリ起動時にスプラッシュ画像が表示されたままの状態になる場合は、一度、iframe タグからではなく、JavaScript から iframe を追加してみてください。