私の Web サイトでは、ウィジェットの iframe と同じコンテナーにある独自のボタンを作成し、いくつかの CSS ルールを適用しました。
HTML:
<div id="playerContainer">
<span id="closePlayer" class="glyphicon glyphicon-remove"></span>
<iframe src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/164855780&amp;color=5ab7e6&amp;auto_play=true&hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false" style="display: inline;"></iframe>
</div>
CSS:
#closePlayer {
position: fixed;
bottom: 142px;
right: 3px;
z-index: 999;
}
JS (jQuery を含む):
document.getElementById('closePlayer').addEventListener('click', function() {
$(this).parent().fadeOut(400, function() {
$(this).remove();
});
});
どのように見えるか: http://i.imgur.com/4HJr4HX.png
これは少し前に公開されたことは知っていますが、見たばかりです。誰かの助けになることを願っています:)