Tenho o seguinte código:
var buttons = $('#videoGallery .vid');
var liHeight = $('#videoGallery li').height();
buttons.click(function(){
var videoID = $(this).attr('data-videoID');
var videos = $('<div id="meuVideo"> <iframe width="560" height="315" src="https://www.youtube.com/embed/'+ videoID +'?controls=0&showinfo=0" frameborder="0" allowfullscreen></iframe> </div>');
$('#meuVideo, .nowPlaying').remove();
videos.insertAfter(this).hide().slideDown("fast");
$('<span class="nowPlaying">▼ Reproduzindo ...</span>').insertAfter(this);
$('html, body').animate({
scrollTop: (videos.offset().top-liHeight)
}, 200);
});
$('#close').click(function(){
$('#meuVideo, .nowPlaying').remove();
});
#videoGallery ul {
list-style: none;
margin: 0;
padding: 0;
}
#videoGallery span {
display: block;
background-color: steelblue;
color: #fff;
font-family: sans-serif;
cursor: pointer;
padding: 4px 10px;
border-bottom: 1px solid #fff;
}
#videoGallery li {
position: relative;
}
span.nowPlaying {
position: absolute;
top: 0;
right: 0;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div id="videoGallery">
<ul>
<li><span class="vid" data-videoID="6AmRg3p79pM">Video 1</span></li>
<li><span class="vid" data-videoID="MkLFlaWxgJA">Video 2</span></li>
<li><span class="vid" data-videoID="kIhe7nFcbUg">Video 3</span></li>
<li><span class="vid" data-videoID="El3IZFGERbM">Video 4</span></li>
<li><span id="close">Fechar Tudo</span></li>
</ul>
</div>
O resultado pode ser visto aqui.
Da forma como está, só é possivel adicionar vídeos do YouTube. Gostaria que fosse possível adicionar também vídeos do Daily Motion e do UOL, com esses players:
//DailyMotion
<iframe frameborder="0" width="480" height="270" src="//www.dailymotion.com/embed/video/x3hyqc1" allowfullscreen></iframe>
//UOL
<iframe width="640" height="360" src="http://mais.uol.com.br/static/uolplayer/?mediaId=15704761" allowfullscreen frameborder="0"></iframe>
Gostaria que ficasse assim:
<li><span class="vid" data-videoID="6AmRg3p79pM">Video 1 - Youtube - dailymotion - Uol</span></li>