CXDI - Serve Technology

  Mediaelements.js Dailymotion Embed Player

Custom Dailymotion Embed Video Player with Video.JS See the Pen Dailymotion Embed Player Using Video.JS by SH20RAJ ( @SH20RAJ ) on CodePen . See All Related Links  Blogger Demo with Fantasy Skin :-  https://codexd-india.blogspot.com/2021/05/new-song.html Simple Dailymotion Player on Codepen :-  https://codepen.io/SH20RAJ/pen/XWMbjaG Add Skins To your VideoJS Player :-  https://codexdindia.blogspot.com/2021/01/video-js-custom-skin-implement-city.html Video Player with forest theme on JsFiddle :-  https://jsfiddle.net/sh20raj/Lhmtcznv/3/

Custom HTML5 Video Player - CuteSu - VideoJS Custom Skin Implementation Full Screen Demo :-  https://sopplayer.sh20raj.repl.co/CatSu/ Steps :- 1. Add </video> Tag...     - About Video Tag -> <video id="my-video" class="video-js" controls poster="https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.jpg" data-setup='' loop> <source src="https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-1080p.mp4" type='video/mp4'/> </video> 2. Add CSS CDN...     (Before </head> Tag) <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/sh20raj/SopPlayer@main/CatSu/catsu.min.css"/> <link rel='stylesheet' href='https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css'> <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Questrial'> 3....

VideoJs Custom YouTube Embed Player There are 2 Ways to Integrate .I will show you the simplest way. Ways :-      1. Go and see Documentation :-  https://www.npmjs.com/package/videojs-youtube     2. See Below --- Add CDNs To Your WebPage :-  1. Css CDN Before </head> Tag <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.12.0/video-js.min.css" /> 2. JavaScript CDNs before </body> Tag <script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.12.0/video.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-youtube/2.6.1/Youtube.min.js"></script> 3. And add <video> Tag with type="video/youtube" in body ( where you want to place video ) <video id="my-video" class="video-js" controls preload="auto" width="640" height="...

SP-FLAMINGO SopPlayer Skin Integration See Demo :- https://sopplayer.sh20raj.repl.co/flamingo/  Demo Website :-  https://sopplayer.github.io/SP-FLAMINGO/  or  https://sopplayer.sh20raj.repl.co/flamingo View on Repl.it :-  https://replit.com/@SH20RAJ/SopPlayer#flamingo Steps to Import :-  Steps :-        1. Use  class = "sopplayer" in Your <video> Tag .      2. And Add  data-setup = "{}" , attribute like this . HERE IS THE FULL VIDEO CODE      < video   id = "my-video"   poster = " https://i.ytimg.com/vi/YE7VzlLtp-4/maxresdefault.jpg "           class = "sopplayer"   controls   preload = "auto"   data-setup = "{}"   width = "500px" >        <!--Use class="sopplayer" and data-setup="{}" -->    ...

See Video Documentation :-    See All Video.JS Demo Here - > Download There are a few ways to get started using Video.js (currently v7.10.2), but you should select the one that best fits your particular use case. Video.js CDN Our friends at  Fastly  are nice enough to provide hosting for all the necessary files for Video.js on their content delivery network. Using these hosted files is probably the easiest way to get started using Video.js, you simply need to include the following links in your page. Demo <video> Tag ... Note :- Assign  <video id="my-video" class="video-js" controls preload="auto" width="640" height="364" poster="MY_VIDEO_POSTER.jpg" data-setup="{}" > <source src="https://commondatastorage.googleapis.com/gtv-videos-bucket/CastVideos/mp4/BigBuckBunny.mp4" type=...

Video-js Custom Skin Implement ( City , Fantasy , Forest , Sea ) Firstly See How to integrate Video.Js Video Player in Simple HTML5 Video Player View-> Customize Using Video.js straight out of the box is fine, but we think it's better if you make it your own. Plugins and skins make it possible to completely customize your player. Skinning The player skin is completely built from HTML and CSS, including when Flash and other players like YouTube are used. Skin changes can be as simple as centering the play button (you can just add the 'vjs-big-play-centered' class to your video tag), or as complex as creating entirely new layouts. We've built a codepen project where you can explore different changes. Home Page Themes The themes in the home page come from the  Videojs Themes library . To use them in your player, import the CSS, then add the relevant class to your video tag. For example, if you want to use the  City  theme, you could set up your HTML like so: <!-- I...