Modernizr provides an easy way to detect any new feature so that you can take the corresponding action. For example, if a browser does not support video feature then you would like to display a simple page. You can create CSS rules based on the feature availability and these rules would apply automatically on the webpage if the browser does not support a new feature. Modernizr is a small JavaScript Library that detects the availability of native implementations for next-generation web technologies. There are several new features which are being introduced through HTML5 and CSS3 but same time many browsers ... Read More

Whenever you face such issue, it would mean you have not written the CSS properly.Just add the following in CSS −* {    zoom:1;    -ms-content-zooming:none; }For some code, even the following works −@viewport {    width:320px; } @-ms-viewport {    width:320px;    zoom-user:fixed;    max-zoom:1;    min-zoom:1; }

In the following article, we are going to learn about how to create a transformation matrix with HTML5. HTML5 canvas provides methods that allow modifications directly to the transformation matrix. The transformation matrix must initially be the identity transform. It may then be adjusted using the transformation methods. Using the transform() method The transformation matrix of the current context can be changed using the transform() method.in other words, transform() method lets you scale, rotate, move, and skew the current context. Note − Only drawings that were created after the transform() method was called will be impacted by the transformation. Syntax ... Read More

While creating messageChannel, it internally creates two ports to send the data and forwarded it to another browsing context.postMessage() − Post the message throw channelstart() − It sends the dataclose() − it closes the portsIn this scenario, we are sending the data from one iframe to another iframe. Here we are invoking the data in function and passing the data to DOM.Examplevar loadHandler = function(){    var mc, portMessageHandler;    mc = new MessageChannel();    window.parent.postMessage('documentAHasLoaded','http://foo.example',[mc.port2]);        portMessageHandler = function(portMsgEvent){       alert( portMsgEvent.data );    }    mc.port1.addEventListener('message', portMessageHandler, false);    mc.port1.start(); } window.addEventListener('DOMContentLoaded', loadHandler, false);

In the following article, we are going to learn about image buttons with HTML5. In this task we are making the image to act as a button, When the user clicks the button, the form is sent to the server. Let's look into it. What is image button Image buttons are created by placing tag inside the tag creates a clickable HTML button with an image embedded in it. tag By using the tag we can include an image on a HTML page. Images are not actually embedded in the webpages; instead, they are connected to ... Read More

The only access to camera device is not possible in iOS. The official specification suggests the following −A User Agent implementation of this specification is advised to seek user consent before initiating capture of content by microphone or camera. This may be necessary to meet regulatory, legal and best practice requirements related to the privacy of user data. In addition, the User Agent implementation is advised to provide an indication to the user when an input device is enabled and make it possible for the user to terminate such capture.Similarly, the User Agent is advised to offer user control, such ... Read More

Use the following method to create a pattern with HTML5 Canvas: createPattern(image, repetition)− This method will use an image to create the pattern. The second argument could be a string with one of the following values: repeat, repeat-x, repeat-y, and no-repeat. If the empty string or null is specified, repeat will be assumed.ExampleYou can try to run the following code to learn how to create a pattern −                    #test {             width:100px;             height:100px;           ... Read More

To make a form with HTML, we use the following −    Details:    Student Name    Exam Date and Time     To make a form with jQuery and HTML, add input type text as −$form.append('');A better example would be − $myform = $(""); $myform.append(''); $('body').append($myform);

If the canvas looks distorted, then try to change the height and width −The default height and width of the canvas in HTML5 is of 2/1 ratio −width = 300 height = 150ExampleLet us see an example −                    #mycanvas{border:1px solid red;}                         Output

Retrieve the mouse coordinates in the click event. Now, retrieve the element by hiding your overlay, and use the following. After that, redisplay the overlay −document.elementFromPoint(x, y)You can also use the following CSS −div {    pointer-events:none; }