Flat Skin Retina for JW Player

Preview
  • Description
  • FAQ
  • Screenshots
  • DEMO
  • Updates & Support

Options

  • Now reinforce JW Participant 8.x
  • Top class Skins for JW Participant 8: Unfastened, Top class, Endeavor, Advertisements
  • Pores and skin for JW Participant 8 this is the most well liked video participant on the internet, continue to exist over 2 million websites
  • Pores and skin with Flat Taste
  • Retina Able & Totally Responsive
  • Limitless colours – any color you prefer
  • 8 Other Demos
  • HTML5 & CSS3
  • Give a boost to and updates
  • Wishlist Give a boost to
  • SVG recordsdata incorporated and Neatly Documented

Come with the surface at the web page

<hyperlink rel="stylesheet" kind="textual content/css" href="//yoursite.com/yourstyles/flat.min.css>
<script kind="textual content/javascript" src="./jwplayer/jwplayer.js" ></script>
<script kind="textual content/javascript">jwplayer.key="YOUR_JW_PLAYER_KEY";</script>

and

var videoPlayer = jwplayer('player_example').setup({
    width: 640,
    top: 360,
    document: "/uploads/instance.mp4",
    symbol: "/uploads/instance.jpg",
    pores and skin : {
        controlbar: {
          "icons": "#ffffff",
          "iconsActive": "#1abc9c" 
        },
    }
});

Transfer the timeslider in-line with different controls

videoPlayer.on('in a position', serve as() {
    // Transfer the timeslider in-line with different controls
    const playerContainer = videoPlayer.getContainer();
    const buttonContainer = playerContainer.querySelector('.jw-button-container');
    const spacer = buttonContainer.querySelector('.jw-spacer');
    const timeSlider = playerContainer.querySelector('.jw-slider-time');
    buttonContainer.replaceChild(timeSlider, spacer);
});

Preview

Environment Customized Colours

  • pores and skin.controlbar.textual content
    • The colour of any simple textual content within the regulate bar, such because the time.
  • pores and skin.controlbar.icons
    • The default, inactive colour of all icons within the regulate bar. This feature additionally controls the colour of the play, pause, and replay icons within the inactive and whole states.
  • pores and skin.controlbar.iconsActive
    • The colour of hovered or decided on icons within the regulate bar.
  • pores and skin.controlbar.background
    • The background colour of the regulate bar and the amount slider. The default background is clear.
  • pores and skin.timeslider.growth
    • The colour of the bar within the time slider stuffed in from the start of the video in the course of the present place. The buffer area of the regulate bar is 50% of the opacity of this colour. The colour of the amount slider may be managed through this feature.
  • pores and skin.timeslider.rail
    • The colour of the bottom of the timeslider, referred to as the rail.
  • pores and skin.menus.textual content
    • The colour of inactive, default textual content in menus and the Subsequent Up overlay.
  • pores and skin.menus.textActive
    • The colour of hovered or decided on textual content in menus. This feature additionally controls the textual content colour within the Uncover overlay and the hover state textual content colour within the Subsequent Up overlay.
  • pores and skin.menus.background
    • The background colour of menus and the Subsequent Up overlay.
  • pores and skin.tooltips.textual content
    • The textual content colour of tooltips.
  • pores and skin.tooltips.background
    • The background colour of tooltips.

Reference in Documentation

  • JW Participant 8 reinforce
  • Be told extra about The usage of JW Participant Skins
  • Be told extra about CSS Skinning Information
  • Be told extra about Construction JW Participant Skins
  • Be told extra about Pores and skin CSS Categories Reference
  • Be told extra about Pattern CSS Document
  • Icons font generator the use of SVG recordsdata
  • PX to EM conversion made easy
  • On-line CSS Minifier/Compressor
  • JW Participant Innovation: Analysis, Roadmap, Experiments
  • JW Participant Supply Code
  • The way to construct JW Participant from supply
  • Crossdomain Document Loading

Changelog

  • Flat Pores and skin Retina for JWPlayer 8.13.8 – 09 Might 2020.
  • Flat Pores and skin Retina for JWPlayer 8.12.4 – 02 February 2020.
  • Flat Pores and skin Retina for JWPlayer 8.3.0 – 06 Might 2018.
  • Give a boost to JW 7.9.3 and timeSliderAbove – 24 February 2017.
  • Give a boost to JW 7.7.1 and Icons through Base64 – 14 October 2016.
  • Give a boost to upload emblem emblem on regulate bar – 02 Might 2016.
  • Release: The release of the Flat Pores and skin Retina for JW7 venture – 02 September 2015.

Different Skins

  • Flor – HTML5 Video Participant
  • Pores and skin for VideoJS: Football, Fuzzy, AIR, Flat, Tube
  • Skins for JWPlayer: AIR, Flat, Tube, Skinny

Preview
Preview
Preview

or
Shopping Cart
  • Your cart is empty.
Scroll to Top