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

Question

I want to change the opacity of the JW Player Display Icon (the play button) from 1 to .35 and want to avoid making my own skin. I don't see anything about opacity or any example code in the docs here: http://support.jwplayer.com/customer/portal/articles/1413071-skin-xml-reference#dispaly

I can easily change the opacity in Chrome's Dev Tools by finding the jwdisplayIcon class and changing the opacity. Running this line in Chrome's console also works:

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

But I tried adding the same line to my JavaScript and it didn't work. I also tried adding the following to my CSS and it didn't work:

.jwdisplayIcon {
  opacity: .35;
}

This is the inherited setup I have:

    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"
      });

It seems like this JavaScript setup would be the place to make changes, but I don't know what to add. I tried adding the following line to the setup, but the browser threw an Unexpected Token on the '()' (it seems like this can only be called inside an event?):

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

I tried adding the following to my setup even though it would target the whole player instead of just the display icon, and it did nothing at all:

opacity: ".35",

I found this JSFiddle to play with JW Player and changed the icons: false to the following, but it did not work:

 icons: {
     opacity: .35,
 }

What do I need to do to change the opacity without building a new skin?

Answer 1

You should make the graphic in photoshop or another image editing program and change the opacity there.

That way it will work in both rendering modes in the player, Flash or HTML5.

Your CSS work arounds here will only work for the HTML5 player.

Yes, you would have to build a new skin in order to do this, I'm afraid.