YouTube Grid Gallery: как я могу заставить плеер появляться во всплывающем окне? - PullRequest
0 голосов
/ 02 октября 2011

Я использую следующий код:

<head>
<script type="text/javascript" src="http://swfobject.googlecode.com/svn/trunk/swfobject/swfobject.js"></script>
<script type="text/javascript">
function loadVideo(playerUrl, autoplay) {
  swfobject.embedSWF(
      playerUrl + '&rel=1&border=0&fs=1&autoplay=' + 
      (autoplay?1:0), 'player', '290', '250', '9.0.0', false, 
      false, {allowfullscreen: 'true'});
}

function showMyVideos2(data) {
  var feed = data.feed;
  var entries = feed.entry || [];
  var html = ['<ul class="videos">'];
  for (var i = 0; i < entries.length; i++) {
    var entry = entries[i];
    var title = entry.title.$t.substr(0, 15);
    var thumbnailUrl = entries[i].media$group.media$thumbnail[0].url;
    var playerUrl = entries[i].media$group.media$content[0].url;
    html.push('<li onclick="loadVideo(\'', playerUrl, '\', true)">',
              '<span class="titlec">', title, '...</span><br /><img src="', 
              thumbnailUrl, '" width="130" height="97"/>', '</span></li>');
  }
  html.push('</ul><br style="clear: left;"/>');
  document.getElementById('videos2').innerHTML = html.join('');
  if (entries.length > 0) {
    loadVideo(entries[0].media$group.media$content[0].url, false);
  }
}
</script>
</head>
<body>
<div id="playerContainer" style="width: 20em; height: 180px; float: left;">
    <object id="player"></object>
</div>
<div id="videos2"></div>
<script 
    type="text/javascript" 
    src="http://gdata.youtube.com/feeds/users/yerface/uploads?alt=json-in-script&callback=showMyVideos2&max-results=9">
</script>
</body>
</html>

который находится здесь: http://groups.google.com/group/youtube-api-gdata/browse_thread/thread/f3994f8078d20fe6.

Какой самый простой способ заставить игрока появляться во всплывающем окне? Я играл с настройками CSS, используя visible и display, но я не могу понять, что это правильно. Любые советы для новичка будут с благодарностью, спасибо!

1 Ответ

0 голосов
/ 03 октября 2011

Если вы хотите, чтобы проигрыватель отображался поверх вашего контента, вы можете использовать position: absolute; в своем CSS, который выводит его из потока содержимого документа.Затем вы используете правила top и left, чтобы разместить их там, где вам нравится.Поскольку вы уже знаете размеры своего всплывающего окна, вы можете отцентрировать его с помощью javascript для расчета верхней и левой позиций.

Удачи,
За Flitig
Netlight Consulting

...