Page redirection is a situation where you clicked a URL to reach a page X but internally you were directed to another page Y. It happens due to page redirection.To redirect from an HTML page, use the META Tag. With this, use the http-equiv attribute to provide an HTTP header for the value of the content attribute. The value in the content is the number of seconds; you want the page to redirect after.Through this, you can automatically redirect your visitors to a new homepage. Set the content attribute to 0, if you want it to load immediately.The following is ... Read More

To add a YouTube Video to your website, you need to embed it. To embed a video in an HTML page, use the element. The source attribute included the video URL. For the dimensions of the video player, set the width and height of the video appropriately.The Video URL is the video embed link. The video we will be embedding our example will be YouTube.To get the embed link, go to a YouTube Video and click embed as shown below. You will get a link fro embed here −You can try to run the following code to learn how ... Read More

Server-sent events standardize how we stream data from the server to the client. To use Server-Sent Events in a web application, you would need to add an element to the document.The src attribute of element should point to an URL which should provide a persistent HTTP connection that sends a data stream containing the events.The URL would point to a PHP, PERL or any Python script which would take care of sending event data consistently. Following is a simple example of web application which would expect server time.You can try to run the following code to learn how ... Read More

You may have run into a situation where you clicked a URL to go to a certain page but were directed to a different page internally. Page redirection is the cause of this. Redirecting occurs when an HTTP request for one page immediately navigates to another one. It differs from simply reloading a website. It is quite simple to do a web page redirection using vanilla JavaScript on the client side. So in this article, we will learn how to redirect web pages using vanilla JavaScript and when to use a particular method.There are many ways to accomplish redirection of ... Read More

Grabbing an object and moving it to a different position is made simpler with the drag and drop idea, which is very dynamic and user-friendly. This enables the user to click and drag an element to another position before letting go of the mouse button to drop it there. Drag and drop events Drag and Drop event consists of various types of events, some of them are listed below. ondrag − is a term used in HTML to describe when an element or text selection is being moved around. ondragstart − is a function that is called when a ... Read More

To use SVG images in HTML5, use element or . To add SVG files, you can use , or element in HTML. Choose any one of them according to your requirement.Here’s how you can add SVG images. If the SVG is saved as a file, it can be directly used as an SVG image:ExampleYou can try to run the following code to use SVG ImagesLive Demo                    #svgelem {             position: relative;             left: 50%;             -webkit-transform: translateX(-20%);             -ms-transform: translateX(-20%);             transform: translateX(-20%);          }             HTML5 SVG Image               HTML5 SVG Image          

Graphics for your responsive site can make it slower, but balancing it with vector graphics can help in minimizing the bandwidth. Through this, amazing graphics work great on mobile site too. Generally, canvas and SVG is used for this purpose.Use HTML5 Scalable Vector Graphics (SVG) to create a design for multiple screen sizes, since it handles it perfectly. Easily present vector based line drawings and do not worry about the pixels on your device since the graphics created with SVG are resolution independent. It scales the result and looks great in the browser.Here, we will look how to work with ... Read More

With HTML, you can easily limit input length. However, with CSS3, it will not be possible, since CSS can’t be used to limit the number of input characters. This will cause a functional restriction.CSS deals with presentation i.e. how your web page will look. This is done with HTML attribute malength, since it’s for behavior.Let’s see how to do it in HTML −ExampleYou can try to run the following code to limit input text lengthLive Demo           HTML maxlength attribute                        Student Name                    

HTML5 Geolocation API lets you share your location with your favorite websites. A JavaScript can capture your latitude and longitude and can be sent to backend web server and do fancy location-aware things like finding local businesses or showing your location on a map.The geolocation APIs work with a new property of the global navigator object ie. Geolocation object.ExampleYou can try to run the following code to find the current location using the Geolocation API, with Latitude and Longitude coordinatesLive Demo                    function showLocation(position) {           ... Read More

HTML5 introduced two mechanisms, similar to HTTP session cookies, for storing structured data on the client side and to overcome the following drawbacks.Cookies are included with every HTTP request, thereby slowing down your web application by transmitting the same data.Cookies are limited to about 4 KB of data. Not enough to store required data.The two mechanisms for storage are session storage and local storage and they would be used to handle different situations.Session StorageThe Session Storage is designed for scenarios where the user is carrying out a single transaction but could be carrying out multiple transactions in different windows at ... Read More