Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
HTML Articles
Page 98 of 151
HTML5 Geolocation without SSL connection
HTML 5 Geolocation is used to find out the location of the user. This can be without SSL connection. This can be generated as follows −// Variable apigeo shows successful location: var apigeo = function(position) { alert("API geolocation success!lat = " + position.coords.latitude + "lng = " + position.coords.longitude); }; var tryapigeo = function() { jQuery.post( "check the location on google map", function(success) { apiGeolocationSuccess({coords: {latitude: success.location.lat, longitude: success.location.lng}}); }) //Gives success on given geolocation .failure(function(err) { //On failure, alert with failure is shown alert("error while showing geolocation! "+err); ...
Read MoreCreate JS Radial gradient with matrix in HTML
JSRadial gradient with matrix is created in the following way. You can try to run the following way to create JS Radial gradient with matrix −var canvas1 = document.getElementById("canvas"); //canvas1 variable to identify given canvas var ctx1 = canvas.getContext("2d"); //This is used to tell context is 2D var gradient1 = ctx1.createRadialGradient(100/horizontalScale, 100/verticalScale, 100, 100/horizontalScale, 100/verticalScale, 0); //This will create gradient with given canvas context gradient1.addColorStop(1, "green"); //New color green is added to gradient gradient1.addColorStop(0, "red"); //New color red is added to gradient ctx1.scale(horizontalScale, verticalScale); //Context matrix ctx1 is shrinked according to horizaontal and vertical scale ...
Read MoreWhat is the difference between SVG and HTML5 Canvas?
The HTML element is a container for SVG graphics. SVG stands for Scalable Vector Graphics. SVG and useful for defining graphics such as boxes, circles, text, etc. 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.The HTML element is used to draw graphics, via JavaScript. The element is a container for graphics.SVGHTML CanvasSVG has better scalability. So it can be printed with ...
Read MoreDrawing text to HTML5 <canvas> with @fontface does not work at the first time
Drawing text in a canvas with a typeface that is loaded via @font-face does not show text correctly at first. This is because the browser has not yet loaded the font from network. Therefore, it makes use of the font, which is already available.The font has to be completed loaded before it is used. This can be ensured using tag. If you want to make sure that the font is available and have some other elements preloaded, then you can do this by using the tag as under You can also load font like this −var newFont = ...
Read MoreHow to programmatically empty browser cache with HTML?
You can tell your browser not to cache your page by using the following meta tags − In addition, try the following: Append a parameter/string to the filename in the script tag. Change it when the file changes.Then the next time you update the file, just update the version i.e.
Read MorePreventing an image from being draggable or selectable in HTML without using JS
Add the following code snippet to image properties, and prevent images from being dragged and selected.img { user-drag: none; user-select: none; -moz-user-select: none; -webkit-user-drag: none; -webkit-user-select: none; -ms-user-select: none; }On double click on a text or image, it is highlighted (selected). The user select property can be used to prevent this. By setting this property to none, we can prevent our image from being selected (highlighted).ExampleYou can try to run the following code to prevent the image from being selected − img { -drag: none; user-select: none; -moz-user-select: none; -webkit-user-drag: none; -webkit-user-select: none; -ms-user-select: none; }
Read MoreDisabling Android's chrome pull-down-to-refresh feature with HTML.
The refresh button which was until now hidden in the flow menu, has been replaced by pull-down-to-refresh feature in chrome. However, some users do not need this feature in their application.body { // disables pull-to-refresh // allows overscroll glow effects overscroll-behavior-y: contain; }The overscroll behaviour property of CSS disables the pull to refresh action. In the above given code we have fixed double pull to refresh animation in the chatbox demo. The inbox blurs while the entire page is being refreshed.
Read MoreExecute a script when the element gets focus in HTML?
Use the onfocus attribute to execute a script when the element gets focus in HTML.ExampleYou can try to run the following code to implement the onfocus attribute − Enter subject name below, Subject: function display(val) { document.getElementById(val).style.background = "blue"; }
Read MoreHow to specify the number of visible options for <select> in HTML?
Use the size attribute to set the number of visible options for element in HTML.ExampleYou can try to run the following code to implement size attribute − Select the countries you have visited till now, India US Canada Australia Bangladesh
Read MoreEnable an extra set of restrictions for the content in an <iframe> in HTML?
Use the sandbox attribute to enable an extra set of restrictions for the content in an in HTML.ExampleYou can try to run the following code to implement sandbox attribute − Your browser does not support iframes.
Read More