Found 601 Articles for Front End Scripts

Is it possible to validate the size and type of input=file in HTML5?

karthikeya Boyini
Updated on 25-Jun-2020 06:26:06

230 Views

Yes, it is possible to validate the size and type of input type = “file”. Use jQuery to get the desired result −                                                        $(function(){             $('form').submit(function(){                var val = true;                   $('input[type=file][data-max-size]').each(function(){                      if(typeof this.files[0] !== 'undefined'){                         var max = parseInt($(this).attr('max-size'),10),                         mySize = this.files[0].size;                         val = max > mySize;                         return val;                      }                   });                   return val;                });             });          

Escaping/encoding single quotes in JSON encoded HTML5 data attributes

George John
Updated on 30-Jul-2019 22:30:22

3K+ Views

To escape single quotes, use json_encode() to echo arrays in HTML5 data attributes.printf('', htmlspecialchars(json_encode(array('html5', ...)), ENT_QUOTES, 'UTF-8'));Or you can also using built-injson_encode(array('html5', ...), JSON_HEX_APOS)

Display video inside HTML5 canvas

Rishi Rathor
Updated on 30-Jul-2019 22:30:22

312 Views

You can try the following code snippet to display video inside HTML5 canvas.var canvas1 = document.getElementById('canvas'); var context = canvas1.getContext('2d'); var video = document.getElementById('video'); video.addEventListener('play', function () { var $this = this; (function loop() { if (!$this.paused && !$this.ended) { context.drawImage($this, 0, 0); setTimeout(loop, 1000 / 30); } })(); }, 0);

How to track pages in a single page application with Google Analytics?

Nancy Den
Updated on 25-Jun-2020 06:26:49

194 Views

A Single Page Application (SPA) loads the resources required to navigate throughout the site. This is for the first page load and SPA is a web application or website.The content loads dynamically when your site’s link is clicked and the user interacts with the page. On load, the data stored in the tracker updates as well.Update the trackerga('set', 'page', '/new-page.html');Record pageviewSend a pageview immediately after the tracker updates −ga('send', 'pageview');

Raise the Mobile Safari HTML5 application cache limit?

Chandu yadav
Updated on 30-Jul-2019 22:30:22

461 Views

Application cache on Safari has no limit on storing data, but for mobile Safari the rues are different.The upper limit is 5MB.On mobile safari, the local storage and session storage are 5MB each. On WebSQL, a user is asked for permissions but you cannot store data any more than 50MB.With the latest iOS version, if a web app needs more then 5MB of cache storage, a user will be asked if it has permission to increase it. This is done so that the user can manage own memory space.

HTML5 Input type=number removes leading zero

Lakshmi Srinivas
Updated on 25-Jun-2020 06:16:28

4K+ Views

The leading zero issues may arise when you want to add an international phone number.To solve this −On iOS, the numeric keyboard appears with only numbers.On Android phones, the "tel" is rightly interpreted but not the pattern.You can also use −

How to put the WebBrowser control into IE9 into standards with HTML?

Arjun Thakur
Updated on 25-Jun-2020 06:17:19

102 Views

To place the WebBrowser control into IE9 standards, you need to add the following line in your HTML web page −You can also try this for Internet Explorer 9 −You can also try this for Microsoft Edge −

What is the correct use of schema.org SiteNavigationElement in HTML?

Daniol Thomas
Updated on 27-Jan-2020 07:27:04

537 Views

The schema.org SiteNavigationElement extends WebPageElement. It is used to mark-up links that would make amazing contextual links.                    Home page                              My demo page          

How to “enable” HTML5 elements in IE 8 that were inserted by AJAX call?

George John
Updated on 27-Jan-2020 07:26:37

166 Views

To enable HTML5 elements in IE, you need to use plugins like html5shiv. The HTML5 Shiv enables use of HTML5 sectioning elements in legacy Internet Explorer and provides basic HTML5 styling for Internet Explorer 6-9,With that, you can also use document.createElement to create an element.var demo = document.createElement("demo"); demo.innerHTML = "Working!"; document.appendChild(demo);

How to either determine SVG text box width or force line breaks after 'x' characters?

Krantik Chavan
Updated on 27-Jan-2020 07:26:08

148 Views

Use the getBBox() function and add a single word at a time to a text object. When it gets too wide, you need to add a line feed.var a = Raphael(500, 500); var b = a.text(100, 100).attr('text-anchor', 'start'); var maxWidth = 100; var content = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis nec semper mauris. Sed gravida augue feugiat nulla ultrices efficitur. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed sit amet lobortis eros, et lobortis diam. Aenean arcu velit, condimentum eu lacus in, dignissim bibendum odio. Mauris ultricies nunc et lorem ... Read More

Advertisements