button - Spotify 播放按钮隐藏元素中的大小

Question

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

当用户滚动到每个面板时，可以强制刷新这些 iframe，但这感觉像是黑客攻击和一堆额外的 HTTP 请求。

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

提前致谢

小

Answer 1

负责 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
        );
    })();

您可以在 this jsFiddle 中看到它的实际效果。 .

免责声明:我是 Spotify 员工。