A basic JW Player plugin to display a text banner overlay at the top of the video player instance

main.js

// Pass the plugin reference and configuration parameter ('text') to the embed script
jwplayer('id-of-container').setup({
  file: '/path/to/my/video.mp4',
  plugins: {
    '/path/to/overlay.js': {
      text: 'Text that you want to go within the overlayed banner'
    }
  }
});

overlay.js

(function( jwplayer ) {

  var overlay = function( player, config, div ) {

    var setupOverlay = function() {
      div.innerHTML = config.text;
    };

    var showOverlay = function() {
      setStyle({
        opacity: 1
      });
    };

    var hideOverlay = function() {
      setStyle({
        opacity: 0
      });
    };

    var setStyle = function( object ) {
      for(var style in object) {
        div.style[ style ] = object[ style ];
      }
    };

    // Matches our text container to the size of the player instance
    this.resize = function( width, height ) {
      setStyle({
        position: 'absolute',
        margin: '0',
        padding: '10px 15px 10px',
        background: 'rgba( 0, 0, 0, .7 )',
        color: 'white',
        fontSize: '12px',
        width: '100%'
      });
    };

    // Bind player events
    player.onReady( setupOverlay );
    player.onPlay( hideOverlay );
    player.onPause( showOverlay );
    player.onComplete( showOverlay );
  };

  jwplayer().registerPlugin( 'overlay', overlay );

})( jwplayer );

I put this whole code but it does not seems to work. overlay (line number 3 in overlay.js) does not called. Can you please help me.

hi , is there any change ?

not working