In this tutorial, we're going to understand how to set up different video quality in video.js player. Setting up a different video quality means our video player, created using video.js, is going to have multiple resolutions of the same video and the end user can switch the resolution basis as per their liking or their bandwidth. However, video.js doesn't support this feature natively out of the box, which means we'll have to use a plugin (as video.js has a wide range of plugins and support) to set multiple video resolutions for our video player. The video.js plugin that we're going ... Read More

In this tutorial, we're going to learn the procedure to play YouTube videos using the video.js player. Video.js is a very popular modern web video player which supports all the latest video formats including YouTube, Vimeo, etc. Now, we'll see how the video.js library can be used for playing YouTube videos using the 'videojs-youtube' package. For playing YouTube videos in the video.js player we need to install a package 'videojs-youtube' in our project. Installation of the package is very easy and can be done using bower or node package manager. Installing video.js YouTube Use the following command for installation of ... Read More

In this article, we’re going to learn how to play Vimeo video files using the video.js player. Video.js is an easy-to-use and very popular modern video player which has the support of all the latest video formats including Vimeo, youtube etc across a variety of platforms like desktops, laptops, etc. Now, let’s focus on creating a video player which will play our Vimeo files, by making use of the ‘videojs-vimeo’ package. This package will help us to play Vimeo video files, without much hassle. How to play Vimeo files using Video.js player? For playing our Vimeo videos in the video.js ... Read More

Video.js is an open-source, HTML5 web video player. It supports a variety of HTML5 media source extensions along with modern video playback technologies like YouTube, HLS Stream, etc. through plugins. Video.js supports video playback on a range of display sizes with a plethora of devices like desktops and mobile devices. In this tutorial, we're going to learn how to play the QuickTime MOV files using in our web browser using video.js. MOV is a very common video container used in Apple's QuickTime player for storing movies and video files. These containers use a compression algorithm designed by Apple Computer and ... Read More

In this tutorial, we're going to learn how to play HLS stream in HTML5 video player using video.js. HTTP Live Streaming, also known as HLS Stream, is a HTTP-based communication protocol which used dynamic or adaptive bit rate for streaming videos. This protocol was developed and published by Apple Inc. in the year 2009 and a wide variety of media player, web browsers, mobile devices and streaming media players support this protocol. HLS has the benefit of being compatible with all Internet-connected devices, making it easier to adopt than streaming protocols that need the usage of specialist servers. Another advantage ... Read More

We use the for loop statement of JavaScript for repeating a set of statements inside the loop body a specified number of times. A nested for loop, as the name suggests, is made up of more than one for loop one nested inside of the other. This allows us to loop over multidimensional data structures such as matrices. The nested for loop in JavaScript A simple for loop executes a specified number of times depending on the initialization value and the terminating condition. A nested for loop on the other hand, resides one or more for loop inside an outer ... Read More

In this tutorial, we will learn that can scripts are inserted with innerHTML. There are various properties in JavaScript that help in working with the HTML of the current page. The innerHTML property in JavaScript is used to add the Html to the element. It also returns the content present in an element. Scripts are the programs or codes of JavaScript that makes a webpage interactive and dynamic. We can add the script in the script tag on the same page or another JavaScript page linked with an HTML file. The HTML is inserted in the innerHTML property for an ... Read More

In this tutorial, we will learn to fix broken images automatically in jQuery. Have you ever seen broken images while wondering on any website which shows only alternative text with the default icon of the broken image? Don’t you think it is a bad user experience? Obviously, it is. So, when you develop the application or website, you should write some JavaScript or jQuery code such that it can automatically replace broken images. Here, we will learn 2 to 3 different methods to fix broken images automatically using jQuery. Use the ‘onerror’ event inside the HTML ‘ ’ tag ... Read More

In this tutorial, we will learn to create and save the text file in JavaScript. Sometimes, developers need to get texts or content from the user and allow users to store content in a text file and allow the file to download to the local computer. Many JavaScript libraries are available to achieve our goal, but we have used the best two libraries in this tutorial to create and save the text file. Create a text file using custom text and save it to a local computer We will use normal JavaScript operations to create and save the text file ... Read More

Video.js is a very popular library for creating a web video player for videos, which has been built on HTML5 from the scratch. Video.js supports all the basic video formats like mp4, WebM, Flv, etc. It is very effortless and straightforward to create a modern web video player in video.js for these various video types. However, the procedure is a little different for flv-type video formats. In this article we’re going to learn how to play the flv videos using the video.js web player. First, let’s start with how to create a basic web player in video.js using mp4 and ... Read More