To play randomly, add the songs like this:init ([    'http://demo.com/songs/song1.mp3,    'http://demo.com/songs/song2.mp3,    'http://demo.com/songs/song3.mp3 ]);Use the following to play randomly using Math.random:function displayRandom() {    var audio = Math.floor(Math.random() * (collection.length));    audio = collection[audio];    audio.play();    setTimeout(loop,audio.duration*1000); }

HTML5 canvas provides compositing attribute globalCompositeOperation that affect all the drawing operations.                    var compositeTypes = [             'source-over','source-in','source-out','source-atop',             'destination-over','destination-in','destination-out',             'destination-atop','lighter','darker','copy','xor'          ];          function drawShape(){             for (i = 0; i < compositeTypes.length; i++){                var label = document.createTextNode(compositeTypes[i]);                document.getElementById('lab'+i).appendChild(label);                var ctx = document.getElementById('tut'+i).getContext('2d');                // draw rectangle                ctx.fillStyle = "#FF3366";                ctx.fillRect(15,15,70,70);                // set composite property                ctx.globalCompositeOperation = compositeTypes[i];                // draw circle                ctx.fillStyle = "#0066FF";                ctx.beginPath();                ctx.arc(75,75,35,0,Math.PI*2,true);                ctx.fill();             }          }                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              

The rupee symbol is the following and not every browser supports it:₹To make it visible on your web page: You can use the following as well:₹

To blend, you need to perform blending of two images in proportion 50-50.Let us see how: Blended image    window.onload = function () {       var myImg1 = document.getElementById('myImg1');       var myImg2 = document.getElementById('myImg2');       var myCanvas = document.getElementById("canvas");       var ctx = canvas.getContext("2d");       // width and height       var w = img1.width;       var h = img1.height;       myCanvas.width = w;       myCanvas.height = h;       var pixels = 4 ... Read More

Web RTC required peer-to-peer communication between browsers. This mechanism required signalling, network information, session control and media information. Web developers can choose different mechanism to communicate between the browsers such as SIP or XMPP or any two way communications. An example of createSignalingChannel():var signalingChannel = createSignalingChannel(); var pc; var configuration = ...; // run start(true) to initiate a call function start(isCaller) {    pc = new RTCPeerConnection(configuration);    // send any ice candidates to the other peer    pc.onicecandidate = function (evt) {       signalingChannel.send(JSON.stringify({ "candidate": evt.candidate }));    };        // once remote stream ... Read More

The following function is an example of IndexedDB to add data:function add() {    var request = db.transaction(["employee"], "readwrite")    .objectStore("employee")    .add({ id: "001", name: "Amit", age: 28, email: "demo1@example.com" });    request.onsuccess = function(event) {       alert("Amit has been added to your database.");    };    request.onerror = function(event) {       alert("Unable to add data\rAmit is already exist in your database! ");    } }Above, we added the following details in the database:const employeeData = [    { id: "001", name: "Amit", age: 28, email: "demo1@example.com" }, ];

HTML5 is designed, as much as possible, to be backward compatible with existing web browsers. New features build on existing features and allow you to provide fallback content for older browsers.It is suggested to detect support for individual HTML5 features using a few lines of JavaScript.The latest versions of Apple Safari, Google Chrome, Mozilla Firefox, and Opera all support many HTML5 features and Internet Explorer 9.0 will also have support for some HTML5 functionality.The mobile web browsers that come pre-installed on iPhones, iPads, and Android phones all have excellent support for HTML5.

Here is the HTML5 version of an SVG example that would draw a star using the tag.                    #svgelem{             position: relative;             left: 50%;             -webkit-transform: translateX(-40%);             -ms-transform: translateX(-40%);             transform: translateX(-40%);          }             SVG                     HTML5 SVG Star                       Output

This accepts only URL value in HTML5. This type is used for input fields that should contain a URL address. If you try to submit a simple text, it forces to enter only URL address either in https://www.qries.com format or in http://qries.com format.                    Enter URL :                    

A new feature introduced in HTML 5 is the addition of custom data attributes.A custom data attribute starts with data- and would be named based on your requirement.    ... The above will be perfectly valid HTML5 with two custom attributes called data-subject and data-level. You would be able to get the values of these attributes using JavaScript APIs or CSS in a similar way as you get for standard attributes.