Found 601 Articles for Front End Scripts

IE supports the HTML5 File API

Daniol Thomas
Updated on 27-Jan-2020 08:07:43

95 Views

IE9 does not support File APIIF10 started supported File APIAn example of that would be drag and drop. Now HTML 5 came up with a Drag and Drop (DnD) API that brings native DnD support to the browser making it much easier to code up.                    #boxA, #boxB { float:left;padding:10px;margin:10px; -moz-user-select:none; }          #boxA { background-color: #6633FF; width:75px; height:75px; }          #boxB { background-color: #FF6699; width:150px; height:150px; }                      function dragStart(ev) {   ... Read More

HTML5 Canvas Transformation Matrix

Samual Sam
Updated on 25-Jun-2020 06:35:48

378 Views

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.The transform (m11, m12, m21, m22, dx, dy) method must multiply the current transformation matrix with the matrix described by −m11 m21 dx m12 m22 dy  0   0  1The setTransform(m11, m12, m21, m22, dx, dy) method must reset the current transform to the identity matrix, and then invoke the transform(m11, m12, m21, m22, dx, dy) method with the same arguments.                   ... Read More

Autocomplete text input for HTML5?

George John
Updated on 25-Jun-2020 06:38:21

264 Views

Use the autocomplete attribute for autocomplete text input. The autocomplete attribute is used with a form elements to set the autocomplete feature on or off. If the autocomplete feature is on, the browser will automatically show values, based on what users entered before in the field.If the autocomplete feature is off, the browser won’t automatically show values, based on what users entered before in the field.The following are the attribute values −S. NoAttribute ValueDescription1onThis is the default value. The browser automatically complete values based on what users entered before.2offThe browser won’t complete values based on what users entered before. Users have to ... Read More

Is there any way to embed a PDF file into an HTML5 page?

Lakshmi Srinivas
Updated on 27-Jan-2020 08:04:10

602 Views

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

Is there any way of moving to HTML 5 and still promise multi browser compatibility?

Arjun Thakur
Updated on 25-Jun-2020 06:20:19

154 Views

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.

Cross-origin data in HTML5 Canvas

karthikeya Boyini
Updated on 25-Jun-2020 06:39:27

266 Views

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

Getting Tooltips for mobile browsers in HTML

George John
Updated on 25-Jun-2020 06:22:05

892 Views

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; }

Enable rear camera with HTML5

Samual Sam
Updated on 25-Jun-2020 06:23:01

185 Views

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);

How to make the web page height to fit screen height with HTML?

Lakshmi Srinivas
Updated on 25-Jun-2020 06:24:42

3K+ Views

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;

Cross domain HTML5 iframe issue

Arjun Thakur
Updated on 25-Jun-2020 06:25:26

381 Views

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('','*');

Advertisements