Found 8894 Articles for Front End Technology

How to include Modernizr in HTML document?

Naveen Singh
Updated on 11-Oct-2023 16:48:46

931 Views

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

Properties to create text using HTML5 Canvas

Naveen Singh
Updated on 11-Oct-2023 16:22:23

156 Views

The HTML5 canvas element enables dynamic, scriptable display of bitmap images and 2D forms. A bitmap is updated using a low level procedural model. 2D game development is also aided by HTML5 Canvas. The HTML element is used to draw graphics on a web page. Let’s dive into the article for learning more about creating text using HTML5 canvas. Create text using HTML5 Canvas Use the fillText() or strokeText() methods, or a mix of the two, to add text on the HTML "canvas" element. You can provide a variety of text settings, including style, weight, size, and font, using ... Read More

Usage of autofocus HTML5 attribute

Naveen Singh
Updated on 11-Oct-2023 15:47:23

142 Views

We received a greatness from HTML5. Basic HTML can now be used to carry out tasks that JavaScript and Flash previously handled, such as basic form validation, INPUT placeholders, and audio/video. The autofocus attribute in HTML allows us to automatically focus on components when the page loads, which is another straightforward feature. When the autofocus property is present, the page loads with the INPUT, TEXTAREA, or BUTTON element already chosen. This property is particularly helpful on pages whose primary goal is information gathering. Autofocus HTML5 attribute An element should be focused when the page loads or when the a ... Read More

input type week really exist in HTML5?

Naveen Singh
Updated on 11-Oct-2023 16:46:25

210 Views

The tag designates a field for user-enterable data. The most significant form element is the element. Depending on the type attribute, the element can be presented in a number of different ways. The input element denotes a field for a week input because it has the value "week" in its type property. Instead of requiring users to input the value as a string, these fields could be represented in supporting browsers by controls that let users update it graphically (such as a calendar, for example). Let’s jump into the article to discuss more about input type week ... Read More

Phonegap + Windows Phone 8 : HTML5 viewport meta & scaling issue

karthikeya Boyini
Updated on 04-Mar-2020 08:02:15

84 Views

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

PHP timestamp to HTML5 input type=datetime element

karthikeya Boyini
Updated on 20-Dec-2019 10:47:47

690 Views

For HTML5 input time, in PHP:Exampleecho date("Y-m-d\TH:i:s");OutputThe output would be:2018-28-03T19:12:49HTML with Timestamp would be:

How can I alter the color of an HTML5 canvas element using jQuery?

Daniol Thomas
Updated on 04-Mar-2020 08:00:00

208 Views

To alter the color of an HTML5 canvas, use −document.getElementById("ID").style.background = red;You can also try the following −var ctx = canvas.getContext('2d'); ctx.fillStyle = "#FF0000"; ctx.fill();

Using client side XSLT transformations in HTML5

karthikeya Boyini
Updated on 30-Jul-2019 22:30:22

125 Views

Client-side XSLTProcessor API is part of the HTML5 scripting specification, as stated below:When an XSLT transformation program is triggered by a processing instruction and the browser implements a direct-to-DOM transformation, script elements created by the XSLT processor need to be marked "parser-inserted" and run in document oThe XSLTProcessor.transformToDocument() method adds elements to a Document that does not have a browsing context, and, accordingly, any script elements they create need to have their "already started" flag set in the prepare a script algorithm and never get executed (scripting is disabled). Such script elements still need to be marked "parser-inserted", though, such ... Read More

Drop Shadow with HTML5 Canvas

Naveen Singh
Updated on 11-Oct-2023 18:02:38

914 Views

In HTML5 canvas, you can add shadows to shapes, lines, texts, and images to give them the appearance of depth. You can use the following canvas context attributes to add shadows when using the HTML5 canvas. shadowOffsetX() shadowOffsetY() shadowColor() shadowBlur() shadowOffsetX() The property can be used to get or set a shadow's horizontal distance of a shadow from a page. To change the location of a shadow, you can use positive or negative numbers. Zero is the default value. Syntax Following is the syntax for shadowOffsetX() ctx.shadowOffsetX = h_distance; where h_distance belongs to the horizontal distance ... Read More

Draw Bezier Curve with HTML5 Canvas

Naveen Singh
Updated on 11-Oct-2023 17:48:18

519 Views

The bezierCurveTo() feature of HTML5 Canvas can be used to generate a Bezier curve. The context point, two control points, and an ending point are used to define Bezier curves. Bezier curves, in contrast to quadratic curves, are specified using two control points rather than one, allowing us to produce more intricate curves. The lineWidth, strokeStyle, and lineCap attributes can be used to customise the look of bezier curves. What are Bezier curves Bezier curves may have appeared in desktop publishing and graphics programs. Beziers offer a great deal more form control. Because the beginning of the curve follows its ... Read More

Advertisements