Home » HTML5

HTML5

HTML5 – Styling a Progress Bar

The progress tag introduced in HTML5 can be used to represent the progress of a task. For example, the following code: <progress value="80" max="100"></progress> displays: Unsupported browser Different browsers display the progress bar in different styles: Changing the colour of the progress bar: Now let’s say that you wish to change the colour of the progress bar so that it ...

Read More »

HTML5 Keyboard Input Element Example

In this post we will take a look at the kbd Html tag. This tag allows us to stylize keyboard input in a way that highlights the semantics of the enclosed text. What I meant there was that the text would stand out from surrounding text and would indicate as an input provided by the user using an input device ...

Read More »

HTML5 360 Viewer Example

In this article we will look at something interesting that has a lot of fun. We look at how to build a 360 degree product viewer and a 360 degree panoramic image viewer. You must have noticed the 360 degrees viewer on popular e-Commerce sites where you can rotate and view the product from all around. Also, new smartphones these ...

Read More »

HTML5 Viewport Example

In this article we will take a look at what the Viewport is and how we can tweak it using the meta tag. To demonstrate the concept we will be building a sample application. I will take things one step at a time by first listing the tools & technologies used before moving on to other details. Finally ending with ...

Read More »

HTML5 noscript Tag Example

In this article we look at how to use the noscript tag. This tag enables us to present alternate content to the user if they have JavaScript disabled in their browsers. The tag presents content wrapped inside in case JavaScript is disabled. If JavaScript is enabled then the content of this tag is not displayed. So let’s get going with ...

Read More »

HTML5 Internationalization Example

In this post we will look at Internationalization in HTML5. We will be translating the web page to use the language chosen by the user. At the same time we will keep the process passive, in the sense that, instead of making the decision on language ourselves, we will let the user choose a language of choice from a set ...

Read More »

HTML5 Text Editor Example

In this post, we will take a look at the implementation of an In-browser text editor. The editor will provide basic editing functionality like making the text bold, italic, underline, strikeout and indentation, alignment of blocks of text. A text editor provides useful functionality that can be leveraged in blog comments section apart from other kinds of websites. 1. Introduction ...

Read More »

HTML5 Accordion Example

In this article we will build an Accordion using HTML5 and a dash of JavaScript. The Accordion widget is quite useful when we want to present just a teaser at first and if this interests the user, we provide detailed information. Basically we have content which collapses or starts out as such allowing the user to expand and get into ...

Read More »

HTML5 Webcam Tutorial

1. Introduction In this article, we will look at how to capture images as well as video from user’s webcam. There have been several iterations to enable access to devices from JavaScript. Starting from special attributes for existing input tags to getUserMedia part of the WebRTC APIs. We will look at how to use these and leverage them for accessing ...

Read More »