Question

我正在使用JW播放器，目前我通过rtmp协议在那里播放视频。代码如下所示：

<div id="mediaspace2" >This text will be replaced</div></div>
<script>
jwplayer("mediaspace2").setup({
    flashplayer: "jwplayer.flash.swf",
    file: "rtmp://192.168.1.146:1935/live/myStream",
    height: 270,
    width: 480,
    skin: {
    name:'skins/JW-SKIN-ROUNDSTER.css'
    }

});
</script>

执行此操作后，网页上的结果看起来是正确的： http://i.imgur.com/gIu63tu.png

但现在我想垂直显示它，让我们把它称为肖像模式。所以我添加了简单的div并修改了它的css：

<div id="rotated" style="  -moz-transform:translate(-95px,95px) rotate(270deg);
  -webkit-transform:translate(-95px,95px) rotate(270deg);
  -o-transform: translate(-95px,95px) rotate(270deg);
  -ms-transform:translate(-95px,95px) rotate(270deg);
  transform:translate(-95px,95px) rotate(270deg);">
<div id="mediaspace2" >This text will be replaced</div></div>
<script>
jwplayer("mediaspace2").setup({
    flashplayer: "jwplayer.flash.swf",
    file: "rtmp://192.168.1.146:1935/live/myStream",
    height: 270,
    width: 480,
    skin: {
    name:'skins/JW-SKIN-ROUNDSTER.css'
    }

});
</script>

现在组件已旋转，但视频缩小了：http://i.imgur.com/xN5TVaO.png

有没有办法解决它？

Answer 1

我之前没有试过这个，但是如果你将玩家的高度和宽度改为宽度：480和高度：270怎么办？您可能还需要使用拉伸选项。有关拉伸参数的详细信息，请参阅http://support.jwplayer.com/customer/portal/articles/1413113-configuration-options-reference。

我们喜欢Stack Overflow，但我们不经常在这里检查新商品。获得JW Player支持的最佳方式是http://jwplayer.com/support/

有没有办法在CSS或Jquery中旋转JW Player？

1 个答案: