首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在JW播放器中自动调整大小

在JW播放器中自动调整大小
EN

Stack Overflow用户
提问于 2010-04-06 03:34:03
回答 3查看 13.5K关注 0票数 2

有没有什么方法可以让JW播放器在加载时自动调整大小?

例如,如果电影文件的尺寸小于播放器,则存在黑色背景。我想让这部电影在黑色中传播开来。

提前谢谢。

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2010-05-08 02:59:35

有几个拉伸选项可以通过flashvar设置。其中包括无(无拉伸)、精确适配(不成比例)、均匀(带黑色边框的拉伸)或填充(均匀,但完全填充显示)。它们都列在我们的flashvars page上。

如果你想在DOM中更新播放器的大小,这可能是可能的,但肯定不推荐这样做,因为这会导致Flash重新加载播放器。

最好的

扎克

开发人员,LongTail视频

票数 1
EN

Stack Overflow用户

发布于 2013-10-23 21:30:13

下面的方法对我很有效:

代码语言:javascript
复制
<html>
<script type="text/javascript" src="jwplayer.js"></script>
<script type="text/javascript">jwplayer.key="LicenceCodeGoesHere";</script>
<div id="container">This'll be the player</div>

<script type="text/javascript">
jwplayer("container").setup({
    file:"http://videoURLGoesHere",
    autostart:true,
    width: "100%",
    height: "98%",
ratio: "100%",
responsive: true,
    events:{
        onComplete: function() {
            window.location = "http://redirectGoesHere";
        }
    }

});

</script>
<a href="http://UrlGoesHere">Please click here to skip the video and load the main site</a> 
</html>

希望这能有所帮助!

票数 1
EN

Stack Overflow用户

发布于 2012-06-14 10:40:48

至于调整播放器本身的大小,而不是缩放其中的内容,JW player现在有一个调整大小的函数,您可以将该函数与onMeta事件结合使用,以调整播放器的大小以匹配视频尺寸。请注意,我只在流媒体视频上尝试过这一点,所以我不能100%确定meta事件在基于文件的回放中是否同样有效。

您可能希望使用onMeta事件来计算正确的大小,但要等到onPlay事件实际调用resize()时才调用resize ()-如果在回放开始之前加载了一个静止图像,那么当您在onMeta事件上调整大小时,它仍然会运行,并且它会拉伸,但在一秒钟内看起来有点奇怪。这在onPlay中仍然会发生,但速度更快。

在您的jwplayer('video_id').setup()函数中,只需在选项中包含如下内容:

代码语言:javascript
复制
        events: {
          onMeta: function(event) {
            if(event.metadata.width != undefined && event.metadata.height != undefined && event.metadata.width != 0) {
              var playerWidth = 700;
              var playerHeight = (event.metadata.height/event.metadata.width)*playerWidth;
              jwplayer("video_id").resize(playerWidth, playerHeight);
            }
          }
        }

这是假设您想保持宽度为700,但缩放播放器的高度以适合媒体文件,当然,您的播放器在DOM中具有id "video_id“。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/2580633

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档