I have been experimenting with the following code:
<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>
You can find this code at:http://groups.google.com/group/youtube-api-gdata/browse_thread/thread/f3994f8078d20fe6.
I am looking for guidance on how to make the player appear in a popup using CSS options like visible and display. Any advice for a beginner would be greatly appreciated. Thank you!