更改 JWPlayer 显示图标(播放按钮)的不透明度

Change Opacity of JWPlayer Display Icon (Play Button)

本文关键字:按钮 不透明度 播放 JWPlayer 显示 显示图 图标 更改      更新时间:2023-09-26

我想将 JW 播放器显示图标(播放按钮)的不透明度从 1 更改为 .35,并希望避免制作自己的皮肤。我在这里的文档中没有看到任何关于不透明度或任何示例代码的内容:http://support.jwplayer.com/customer/portal/articles/1413071-skin-xml-reference#dispaly

我可以通过找到jwdisplayIcon类并更改不透明度来轻松更改Chrome开发工具中的不透明度。在Chrome的控制台中运行此行也可以:

$('.jwdisplayIcon').css('opacity', '.35');

但是我尝试在我的JavaScript中添加相同的行,但它不起作用。我还尝试将以下内容添加到我的 CSS 中,但它不起作用:

.jwdisplayIcon {
  opacity: .35;
}

这是我继承的设置:

    jwplayer("expert-video").setup({
        sources: [
          {% for media in medias %}
            {file: "{{ media.media.url }}", label: "{{ media.name }}"},
          {% endfor %}
        ],
        {% if expert.media_poster %}
          image: "{{ expert.media_poster.url }}",
        {% endif %}
        width: "100%",
        aspectratio: "16:9",
        abouttext: "© Copyright 2014",
        aboutlink: "http://example.com",
        skin: "vapor"
      });

似乎这个JavaScript设置将是进行更改的地方,但我不知道要添加什么。我尝试将以下行添加到设置中,但浏览器在"()"上抛出了一个意外令牌(似乎这只能在事件中调用?

jwplayer().getPlugin("display").style.opacity='.35';

我尝试将以下内容添加到我的设置中,即使它会针对整个播放器而不仅仅是显示图标,但它根本没有执行任何操作:

opacity: ".35",

我发现这个 JSFiddle 可以与 JW 播放器一起玩,并将icons: false更改为以下内容,但它不起作用:

 icons: {
     opacity: .35,
 }

我需要做什么才能在不构建新皮肤的情况下更改不透明度?

您应该在 photoshop 或其他图像编辑程序中制作图形并更改那里的不透明度。

这样,它将在播放器(Flash或HTML5)的两种渲染模式下工作。

您在此处的CSS解决方法仅适用于HTML5播放器。

是的,恐怕你必须建立一个新的皮肤才能做到这一点。