Question

我正在调用这样的流媒体播放器：

flowplayer("a.rmPlayer", "libs/flowplayer/flowplayer.swf", {
        plugins: {
            audio: {
                url: 'libs/flowplayer/flowplayer.audio.swf'
            },
            controls:  {
                volume: true
            }
        }
     });

我现在想为每个调用的mp3文件设置不同的封面。 flowplayer提供了coverimage变量（参见http://flash.flowplayer.org/plugins/streaming/audio.html），但是我可以以某种方式将图像存储在数据属性中吗？

Answer 1

我最终使用了以下代码，这似乎完美无瑕。链接：

<a data-toggle="modal" class="rmPlayer" data-fpurl="http://releases.flowplayer.org/data/fake_empire.mp3" data-fpimg="http://releases.flowplayer.org/data/national.jpg">click me</a>

相应的javascript（'#rmPlayerInterface'是模态窗口）

<script type="text/javascript">
$(document).ready(function() {
    player = flowplayer("player", "/libs/flowplayer/flowplayer.swf", {
        plugins: {audio: {url: '/libs/flowplayer/flowplayer.audio.swf'},controls: {url: '/libs/flowplayer/flowplayer.controls.swf'}}, 
        clip: {autoplay: false, autoBuffering: true}
    });

    $(document).on("click", ".rmPlayer", function () {
        $('#rmPlayerInterface').data('playeroptions', $(this).data());//.music = music;
        $('#rmPlayerInterface').modal('show');//:music});//('music', $(this).data('music'));
    });

    $('#rmPlayerInterface').on('show', function () {
        var poptions = $('#rmPlayerInterface').data('playeroptions');
        var c = {url: poptions["fpurl"],coverImage: {url: poptions["fpimg"],scaling: 'orig'}};
        player.play(c);
    });

    $('#rmPlayerInterface').on('hide', function () {
        player.pause();
    });
});

</script>

flowplayer：coverImage作为数据属性

1 个答案: