0

我不知道这是可能的，但我正在使用它们的目录和文件名从我的数据库中输出图像、音频和视频文件。例如在数据库中：

Image:                    Audio:                           Video:

ImageFiles/tulips.png     AudioFiles/LadyintheNight.mp3    VideoFiles/training.mpeg

以下是数据库中每个值存储和输出的变量：

echo $dbImage;
echo $dbAudio;
echo $dbVideo;

所以输出很简单：

ImageFiles/tulips.png 
AudioFiles/LadyintheNight.mp3
VideoFiles/training.mpeg

但我想用这些字符串做两件事：

  • 如果我将每个值作为超链接回显，有没有办法可以单击其中一个链接并显示图像、播放音频的播放器或将视频放在单独页面中的播放器？

  • 如果我$dbImage以图像标签值的形式回显，它会将 url 显示为图像。我的问题是如何显示音频或视频播放器，以便用户可以看到音频/视频并播放它？

4

1 回答 1

1

我正在考虑像 JavaScript 那样为视频创建 iframe 的东西。这只是一个简单的例子，但它会给你一个想法。如果需要，您可以添加精美的灯箱效果，并且为了提高兼容性，最好使用至少 2 种类型的视频格式，mp4 和 ogv。

$('<div id="VideoBackground"></div>').appendTo('body').css({
    opacity: 0.6, 
    position: 'fixed',
    top: 0,
    left: 0,
    width: '100%',
    'z-index':'999',
    'background-color': '#CCCCCC',
    height: $(window).height() + 'px'}).hide();
$('<div id="UpperElement"><iframe id="VideoFrame" frameborder="0" scrolling="no" style="width: 320px; height: 240px;"></iframe></div>').appendTo('#VideoBackground');
$('#UpperElement').css({
    'z-index':'1000',
    'margin':'0 auto',
    'width': '320px',
    'height': '240px'
});

document.getElementById('VideoFrame').onload = function() {
    $('#VideoFrame').contents().find('body').append('<video width="320" height="240" controls><source src="http://www.808.dk/pics/video/gizmo.mp4" type="video/mp4"><source src="http://www.808.dk/pics/video/gizmo.ogv" type="video/ogg">Your browser does not support the video tag.</video>');
}

$('#VideoBackground').show();
$('#UpperElement').show();
于 2013-01-15T07:54:09.020 回答