Found 609 Articles for Front End Scripts

The ondragover event triggers when the dragged element is over the drop target.ExampleYou can try to run the following code to learn how to implement ondragover event in JavaScript −Live Demo                    .drag {             float: left;             width: 100px;             height: 35px;             border: 2px dashed #876587;             margin: 15px;             padding: 10px;          }   ... Read More

The Browser Object Model (BOM) in JavaScript includes the properties and methods for JavaScript to interact with the web browser.BOM provides you with a window objects, for example, to show the width and height of the window. It also includes the window.screen object to show the width and height of the screen.ExampleYou can try to run the following code to learn how to get screen height and width −Live Demo                    document.write("Screen width: " + screen.width);          document.write("Screen width: " + screen.width);          

In this tutorial, we will learn to get the number of internet host port for the current page in JavaScript. The Port number is a 16-bit unique ID of protocols. The port number ranged from 0-65535. The port number is used to find a process by the server. There are 65535, and each port number is associated with its identity. So, let us look to get the port number for the current page in JavaScript. Following are the methods by which we can get the port number of the internet host − Using the location.port Property Using the URL ... Read More

The ondrop event triggers when a dragged element is dropped on the target. You can try to run the following code to learn how to implement ondrop event in JavaScript −ExampleLive Demo                    .drag {             float: left;             width: 100px;             height: 35px;             border: 2px dashed #876587;             margin: 15px;             padding: 10px;          } ... Read More

The window.history object is used to go back or to the next page of the web browser. It has the browser's history and comes with the following two methods −history.back − Go to previous URLhistory.next − Go to next URLExampleYou can try to run the following code to learn how to work with window.history object in JavaScript −Live Demo                    function backPage() {             window.history.back()          }          function nextPage() {             window.history.next()          }                      

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 use a META Tag to redirect your site is quite easy. With this, use the http-equiv attribute to provide an HTTP header for the value of the content attribute.The following is an example of redirecting current page to another page after 2 seconds. If you want to redirect page immediately then do not specify the content attribute.ExampleLive Demo           HTML Meta Tag                     This is demo text.    

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.The getCurrentPosition method retrieves the current geographic location of the device. The location is expressed as a set of geographic coordinates together with information about heading and speed. The location information is returned to a Position object.ExampleYou can try to run the ... Read More

To add background music on a web page, use … element. Also, use the autoplay attribute. This will run music in the background whenever the page loads.Set the width and height in a way the player hides on the web page. The loop attribute is added to specify whether the audio will start over again. Add the music file to the server and mention the link in src attribute.ExampleYou can try to run the following code to add background music to your web page:Live Demo           HTML background music             ... Read More

SVG stands for Scalable Vector Graphics and is a language for describing 2D-graphics and graphical applications in XML and the XML is then rendered by an SVG viewer. Most of the web browsers can display SVG just like they can display PNG, GIF, and JPG.To draw a polygon in HTML SVG, use the SVG element. The element creates a graphic containing at least three sides. For drawing a star in HTML5 SVG, you need to set the x and y coordinates properly for each corner.ExampleYou can try to run the following code to learn how to draw a ... Read More

The svg files are Scalable Vector Graphics. You can add it to a web page using the , , or tag.The .svg file is to be referenced in the src attribute of the tag. Let’s see how to add it using the tag.You can try to run the following code to learn how to use .svg files in a web page. We have a smiley.svg file −           HTML SVG               Design