Skip to main content

Posts

Showing posts with the label JavaScript Libraries

OpenPlayerJS - HTML5 Video/Audio/YouTube Player - Integration

GitHub :- https://github.com/openplayerjs/openplayerjs/ OpenPlayerJS :- https://www.openplayerjs.com/ Video < link rel = "stylesheet" href = "https://cdn.jsdelivr.net/npm/openplayerjs@latest/dist/openplayer.min.css" /> <!-- Adding Css CDN --> < video class = "op-player__media" id = "player" controls playsinline width = "100%" > < source src = "https://archive.org/download/sample-video_202306/SampleVideo.mp4" type = "video/mp4" /> </ video > < hr > < script src = "https://cdn.jsdelivr.net/npm/openplayerjs@latest/dist/openplayer.min.js" > </ script > <!-- Adding JavaScript CDN --> < script > // Check the `API and events` link below for more options const player = new OpenPlayerJS( 'player' ); player.init(); </ script > Audio < link re...
Post a Comment
Read more

AudiPlayV2 Integration - Customizable HTML5 Audio Player with Template

Dev.to Article AudiPlayV2 - Customizable HTML5 Audio Player with Template AudiPlay Version 1 - Documentation | GitHub AudiPlay Version 2 - Documentation | GitHub Steps to Add this Player Put this html template just after starting of <body> Tag. <!-- Customizable template of Audio Player --> <template> <!-- Customizable Css --> <style> button { padding : 0 ; border : 0 ; background : transparent ; cursor : pointer ; outline : none ; width : 40px ; height : 40px ; float : left ; } #audio-player-container { position : relative ; margin : 100px 2.5% auto 2.5% ; width : 95% ; max-width : 500px ; ...
Post a Comment
Read more

Custom HTML5 Video Player with Vanilla JavaScript - KWG Video Player

Custom HTML5 Video Player with Vanilla JavaScript KWG Video Player is a free custom HTML5 video player. It is written in Vanilla JavaScript and no library is required for it to run. The video player can be used in different web projects freely. Multiple instances of the video player can be used in a single page. and the appearance of the player can be customized. Upon creating a KWG Video Player, an Object is created in which one of the members is html5 <video> element and all Media events, properties and methods are available for it. For the whole functionality of KWG Video Player , see documentation source . Integration 1. Load CDNs <link rel= "stylesheet" href= "https://cdn.jsdelivr.net/gh/webgadgets/KwgVideoPlayer@master/kwg-video-player.css" /> <script src= "https://cdn.jsdelivr.net/gh/webgadgets/KwgVideoPlayer@master/kwg-video-player.js" ></script> ...
2 comments
Read more

WebScrapperJS - Get Content/HTML of any website without being blocked by CORS even using JavaScript by WhollyAPI

WebScrapperJS WebScrapperJS - Get Content/HTML of any website without being blocked by CORS even using JavaScript by WhollyAPI Website :- https://sh20raj.github.io/WebScrapperJS/ GitHub | Repl.it | Dev.to Article Grab the CDN or Download the JavaScript File <script src= "https://cdn.jsdelivr.net/gh/SH20RAJ/WebScrapperJS/WebScrapper.min.js" ></script> Enter fullscreen mode Exit fullscreen mode To Get HTML/Text Content of Any Website WebScrapper.gethtml() or WebScrapper.get() var url = ' https://google.com/ ' ; var html = WebScrapper . gethtml ( url ); //html of the url will be stored in this variable console . log ( html ); Enter fullscreen mode Exit fullscreen mode WebScrapper.gethtml() or WebScrapper.get() both are similar. Intialise own WebScrapper with URL new scrapper() let MyWebScrapp...
3 comments
Read more

Convert Markdown or md URL to HTML - MarkdownToHTML - Using JavaScript ft. showdownjs

Markdown is a lightweight markup language for creating formatted text using a plain-text editor. John Gruber and Aaron Swartz created Markdown in 2004 as a markup language that is appealing to human readers in its source code form. Wikipedia Using Markdown you will write(code) less and get more(static content). Code given below are basic JavaScript Codes. Easy to Understand you can modify it and make the functions more dynamic. We will Use - showdownjs  to do so :-  https://github.com/SH20RAJ/markdowntohtml   Here is the code you can use to change your markdown to HTML and show the html on your Website. <script src="https://cdn.jsdelivr.net/npm/showdown/dist/showdown.min.js"></script> <div id="mycontent"></div> <script> var converter = new showdown.Converter(); var md = '[**Showdown**](http://www.showdownjs.com) is *great*\n' + 'because:\n\n' + ...
Post a Comment
Read more

Code/Syntax Highlighting Using highlight.js - Show Codes on Website/Blogger

Code/Syntax Highlighting Using highlight.js - Show Codes on Website/Blogger Code/Syntax Highlighting Solutions Playlist :- Highlight.js is a syntax highlighter written in JavaScript. It works in the browser as well as on the server. It can work with pretty much any markup, doesn’t depend on any other frameworks, and has automatic language detection. Website   GitHub   See More Documentation on GitHub ->  https://github.com/highlightjs/highlight.js/blob/main/README.md See Doc on Repl.it  :-  https://replit.com/@SH20RAJ/Tutorials#highlightjs/index.html See Demo Here ( CXDI - Tutorials ) :-  https://tutorials.sh20raj.repl.co/highlightjs/ A Basic way to integrate hljs (for more see GitHub) +  Add the JavaScript CDN & Code Just before ending of <body> Tag. <link rel="style...
1 comment
Read more

Random Posts