Moral Hazard!!

ドラマーが音楽やホームページやガラクタを作るよ。

iframeをjqueryで遅延読み込み

No Comment 駄日記,

Spotifyの埋め込みiframeが遅かったので、jQueryにて遅延読み込み。

前提

jQueryを読み込んでおく。

html

<div id="spotify-box"></div>

javascript

$(window).on('load', function(){
$('#spotify-box').html('<iframe src="https://open.spotify.com/embed/user/spotify/playlist/xxxxxxxxxx" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>');
});

注釈

・spotify-boxという空divをhtmlに用意し、サイトが読み込まれた後(onload)、そこにiframeを表示させる。
・html()内のiframeでダブルクオーテーションを使用しているので、iframeはシングルクオーテーションで囲んでいる。