javascript - flowplayer: coverImage as data attribute -
i'm calling flowplayer this:
flowplayer("a.rmplayer", "libs/flowplayer/flowplayer.swf", { plugins: { audio: { url: 'libs/flowplayer/flowplayer.audio.swf' }, controls: { volume: true } } });
i'd have different covers each mp3 file being called. flowplayer provides coverimage variable (see http://flash.flowplayer.org/plugins/streaming/audio.html), can somehow have images in data attribute?
i've ended using following code, seems work flawlessly. link:
<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>
and corresponding javascript (with '#rmplayerinterface' being modal window)
<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>
Comments
Post a Comment