CXDI - Serve Technology

Stylish HTML5 Audio Player Using Media Elements.js (Integration) See Video Documentation :-  Steps :-   1. Here a Simple HTML5 Audio Tag .      < div   class = "players" >          < audio   id = "player2"   preload = "none"   controls   style = " width: 450px; " >              < source   src = "https://file-examples-com.github.io/uploads/2017/11/file_example_MP3_1MG.mp3"   type = "audio/mp3" >          </ audio >      </ div >      2. Add Css and Javascript CDNs .      Css CDN   <!-- Css library -->      < link   rel = "stylesheet"   type = "text/css"   href = "https://cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.6/mediaelementplayer.css" > JavaScript CDN <!-- JS Library by CXDI --> < script   src = " https://cdnjs.cloudflare.

Top Websites to convert your Github Repositories to CDN 1.  https://www.jsdelivr.com/ 2. https://rawgit.org/   (Recommended) 3.  https://statically.io/ 4.  https://combinatronics.com/ 5.  https://raw.githack.com/ Bonus 6.  https://unpkg.com/ (NPM)

Sopplayer Integration - HTML5 Stylish Video Player See Demo :-      Visit GitHub  - Codepen  - Repl.it Demo Sopplayer Screenshot See Video Documentation : -  Steps :-       1. Use  class = "sopplayer" in Your <video> Tag .      2. And Add  data-setup = "{}" , attribute like this . <video id="my-video" class="sopplayer" controls preload="auto" data-setup="{}" width="500px"> <!--Use class="sopplayer" and data-setup="{}" --> <source src="https://cdn.jsdelivr.net/gh/SH20RAJ/SopPlayer@main/sample.mp4" type="video/mp4" /> </video>      3. Add the Css CDN before  </ head >  Tag . <link href="https://cdn.jsdelivr.net/gh/SH20RAJ/SopPlayer@main/sopplayer.css" rel="stylesheet" /> <!--Here is the Css Library-->      4. Add t

Convert Here :-  https://base64.guru/converter/encode/audio See Demo :-  https://codexd-india.blogspot.com/2020/12/song-title-here.html https://base64.guru/converter/encode/audio Website :-  https://base64.guru/converter/encode/audio See Demo :-  https://codexd-india.blogspot.com/2020/12/song-title-here.html See Demo :-  https://codexd-india.blogspot.com/2020/12/song-title-here.html Chats During Video Making .......... Unlimited Audio Hosting on blogger or any website   Artical Link is in Description ......    Site :- https://base64.guru/converter/encode/audio We just have to convert(encode)  our audio into base64(text) Take your audio (online / offline) and click on encode .... It will take some time ..... and you will get the text ... Select Output formate as  < audio ></ audio > Here You can see we get the text and we just have to palace our html into our page / blog ..... Let's Test it ........... We had pasted it now we just have to publish and see whether it's

How to disable right click on Images  To avoid unwanted Image Download Right Click on this Image for Testing..                                                                 Right Click on this Image for Testing.. Use This Attribute to your IMG Tag or any other tags ........ (i.e. body) oncontextmenu = " return   false " See Full Document Example :- Take All file used in Video Making from here :-  https://github.com/CXDI/youtube-files/blob/main/javascript/disable-rightclick-on-img-tag.html <! DOCTYPE   html > < html   lang = "en" > < head >      < meta   charset = "UTF-8" >      < meta   name = "viewport"   content = "width=device-width, initial-scale=1.0" >      < title > How to disable right click on Images          to avoid Image Download </ title > </ head > < body >      < h1 > How to disable right click on Images          to avoid Image Download </ h1 >          &l

Code Here window.history.pushState('new' , 'title' , 'new.html') Test it Here   Hlw Change URL to new2.html Change URL to new3.html Change URL ti new4 Chats During Video Making .... How to change Adress bar URL without refreshing the page Code :- window.history.pushState('new' , 'title' , 'new.html') Uses :-      1. Use setTimeout's ....     2. Use in Button onclick Let's Do it ;;;;; See here URL automatic Changed ... Let's Check it with Buttons ...... See here we did it ..... Let's use it more efficiently .......... Thats alll We did it ....... Thanks . ....

How to Play Youtube Embedded Video With Plyr.io Video Player  See Demo on Repl :-  https://repl.it/@SH20RAJ/PlyrVideo#index.html Video Documentation :-  See Latest Documentation :-  Plyr.io Video Player - Integration - Skin Customizing - Adding Download Button :-  https://codexdindia.blogspot.com/2021/05/plyrio-video-player-integration-skin-Customizing-and-Adding-Download-Button-to-plyr.html Step 1 :- Add CDNs       1. Css CDN before </head> Tag <!-- Docs styles --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/CDNSFree2/Plyr/plyr.css" />      2. JS CDN before </body> Tag <script src="https://cdn.jsdelivr.net/gh/CDNSFree2/Plyr/plyr.js"></script> Step 2 :-      Insert Your YouTube iframe Code in Between these div tags :-          (Here The main thing is to add or assign id="player" to your div element) <div style="width: 500p