使用自定义按钮控制Soundcloud HTML5 Widget播放器

Question

使用自定义按钮控制Soundcloud HTML5 Widget播放器

3

我想要做类似于SoundClouds HTML5 Widget API PLayground页面的事情，他们在那里有控制播放器的外部按钮：http://w.soundcloud.com/player/api_playground.html。最终，我将隐藏播放器小部件本身，并使用这些按钮作为音乐控制器。如果您有任何建议或提示，请告诉我，我已经在这里发布了它：http://jsfiddle.net/alexsethalex/qcKed/1/。

- user578968

你真的遇到了什么问题吗？按照小部件 API 页面上的说明操作，应该就没问题了。 - nickf

嘿，是的，我非常困惑 - 我认为我很仔细地跟着做了，但当我尝试使用按钮时，没有任何反应。我检查了我的检查器，发现我的按钮没有触发任何事件。 - user578968

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Paul Osman · Accepted Answer

你是否查看了Widget API文档？

这是一个超级简单的例子：

<!doctype html>
<html>
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <script src="http://w.soundcloud.com/player/api.js"></script>
  <script>
   $(document).ready(function() {
     var widget = SC.Widget(document.getElementById('soundcloud_widget'));
     widget.bind(SC.Widget.Events.READY, function() {
       console.log('Ready...');
     });
     $('button').click(function() {
       widget.toggle();
     });
   });
  </script>
</head>
<body>
  <iframe id="soundcloud_widget"
      src="http://w.soundcloud.com/player/?url=https://api.soundcloud.com/tracks/39804767&show_artwork=false&liking=false&sharing=false&auto_play=true"
      width="420"
      height="120"
      frameborder="no"></iframe>
  <button>Play / Pause</button>
</body>
</html>