2013-11-04 4 views
0

긴 웹 페이지에 여러 개의 SoundCloud 위젯이 있습니다. (예를 들어, SoundCloud 파일이 호출 될 때 웹 페이지의 위치가 바뀌지 않습니다.SoundCloud 위젯 - 닫기 버튼

그러나 위젯에 대한 닫기 버튼을 찾을 수 없으므로 많은 위젯이 한 번에 열릴 수 있습니다. 너무 많은 파일이 열려 있으면 새로운 파일이로드되지 않는 것으로 보입니다. (새로운 위젯을 열면 기존의 보이는 위젯은 자동으로 일시 중지됩니다.)

사용자가 SoundCloud 위젯을 닫을 수있는 방법을 찾은 적이 있습니까?

답변

0

내 웹 사이트에서 방금 위젯 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;amp;color=5ab7e6&amp;amp;auto_play=true&amp;hide_related=false&amp;amp;show_comments=true&amp;amp;show_user=true&amp;amp;show_reposts=false" style="display: inline;"></iframe> 
</div> 

CSS :

#closePlayer { 
    position: fixed; 
    bottom: 142px; 
    right: 3px; 
    z-index: 999; 
} 

JS (포함 jQuery를) :이 잠시 출판 되었음 알고 http://i.imgur.com/4HJr4HX.png

:처럼 보이는 방법

document.getElementById('closePlayer').addEventListener('click', function() { 
    $(this).parent().fadeOut(400, function() { 
     $(this).remove(); 
    }); 
}); 

전에는 보았지만 방금 보았지만 도움이 되길 바란다. 오메 바디 :)