To embed a PDF file in an HTML5 page, use the element.           HTML iframe Tag               HTML5 Tutorial          

Yes, follow this approach −Move to the HTML5 doctype − Use or even the new elements like Or the newer HTML5 tags or , you can still use the outdated tag.The controls have backward compatibility too. The works the same as in browsers that do not support it.However, if you are working t for legacy Internet Explorer, then use html5shiv. It enables the use of HTML5 sectioning elements in legacy Internet Explorer.

For cross-origin data in canvas, add the following attribute to the

When you will click on an element with a title attribute, a child element with title text is appended. Let us see an example −For HTML −    The underlined character. jQuery −$("span[title]").click(function () {    var $title = $(this).find(".title");    if (!$title.length) {       $(this).append('' + $(this).attr("title") + '');    } else {       $title.remove();    } });The following is the CSS −.demo {    border-bottom: 2px dotted;    position: relative; } .demo .title {    position: absolute;    top: 15px;    background: gray;    padding: 5px;    left: 0;    white-space: nowrap; }

To enable rear camera, firstly use −MediaStreamTrack.getSources(gotSources);Now, select the source and pass it in as optional into getUserMedia method.This method is useful for users to set permission to use up to one video input device −var a = {    audio: {       optional: [{sourceId: audioSource}]    },    video: {       optional: [{sourceId: videoSource}]    } }; navigator.getUserMedia(a, successCallback, errorCallback);

Many ways are available to make the web page height to fit the screen height −Give relative heights −html, body {    height: 100%; }You can also give fixed positioning −#main {    position:fixed;    top:0px;    bottom:0px;    left:0px;    right:0px; }You can also use Viewport height to fulfill your purpose −height: 100vh;

Use the postMessage method for transferring data across different domains.ExampleYou can try the following code snippet to solve the cross-domain HTML5 iframe issue −// Using postMessage() window.onmessage = function(e) {    e.source.postMessage(document.body.innerHTML, e.origin); }; window.onmessage = function(event) {    alert(e.data); }; // fire document.getElementById('frame1').contentWindow.postMessage('','*');

Yes, it is possible to validate the size and type of input type = “file”. Use jQuery to get the desired result −                                                        $(function(){             $('form').submit(function(){                var val = true;                   $('input[type=file][data-max-size]').each(function(){                      if(typeof this.files[0] !== 'undefined'){                         var max = parseInt($(this).attr('max-size'),10),                         mySize = this.files[0].size;                         val = max > mySize;                         return val;                      }                   });                   return val;                });             });          

To escape single quotes, use json_encode() to echo arrays in HTML5 data attributes.printf('', htmlspecialchars(json_encode(array('html5', ...)), ENT_QUOTES, 'UTF-8'));Or you can also using built-injson_encode(array('html5', ...), JSON_HEX_APOS)

You can try the following code snippet to display video inside HTML5 canvas.var canvas1 = document.getElementById('canvas'); var context = canvas1.getContext('2d'); var video = document.getElementById('video'); video.addEventListener('play', function () { var $this = this; (function loop() { if (!$this.paused && !$this.ended) { context.drawImage($this, 0, 0); setTimeout(loop, 1000 / 30); } })(); }, 0);