2

我们在分页测验风格的向导/轮播中嵌入了一些 Spotify 播放按钮(使用 jQuery 工具 -yuk- 来提供分页功能);我遇到的问题是,因为每个问题都在最初隐藏的 div 上,所以每个 Spotify iframe 的内容无法确定要渲染哪个播放器(小与大)。

当用户滚动到每个面板时,可以强制刷新这些 iframe,但这感觉就像一个 hack 和一堆额外的 HTTP 请求。

有没有人有这方面的经验?任何不需要我向 Spotify 增加请求的解决方法?

提前致谢

小号

4

1 回答 1

2

负责 Spotify 播放按钮的团队最近发布了修复此问题的更新。您无需对嵌入代码进行任何更改。

这里我附上一些示例代码,以及它的 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 回答