2

ページングされたクイズスタイルのウィザード/カルーセルにSpotifyの再生ボタンがいくつか埋め込まれています（ページング機能を提供するためにjQuery Tools -yuk-を使用）。私が抱えている問題は、各質問が最初は非表示になっているdivにあるため、各Spotify iframeのコンテンツがどのプレーヤーをレンダリングするか（小さいか大きいか）を判断できないことです。

ユーザーが各パネルにスクロールしたときにこれらのiframeを強制的に更新することは可能ですが、これはハックと大量の追加のHTTPリクエストのように感じます。

誰かがこれを経験したことがありますか？Spotifyへのリクエストを増やす必要のない回避策はありますか？

前もって感謝します

S

4

1 に答える 1

2

Spotify Play Buttonを担当するチームは最近、この問題を修正するアップデートをリリースしました。埋め込みコードを変更する必要はありません。

ここでは、jsFiddleと一緒にいくつかのサンプルコードを添付します。

たとえば、これはHTMLです。

    <button id="show-play">Show Play Button</button>
    <div id="container" style="display:none">
        <iframe src="https://embed.spotify.com/?uri=spotify:track:4bz7uB4edifWKJXSDxwHcs" width="300" height="380" frameborder="0" allowtransparency="true">
        </iframe>
    </div>

そのスタイルのCSSプロパティを変更します。

    (function() {
        var button = document.getElementById('show-play'),
            container = document.getElementById('container');

        button.addEventListener(
            'click',
            function() {
                container.style.display = 'block';
            },
            false
        );
    })();

このjsFiddleで実際の動作を確認できます。

免責事項：私はSpotifyの従業員です。

于 2013-10-17T09:12:31.080 に答える