I'm developing a web app which uses HTML5 time fields that is intended for use on both desktop and tablets. The time fields work fine for both Chrome and Safari on desktop, displaying '--:--' as a default value with arrows to increase/decrease time as I'd expect.
The issue is when testing it on a Nexus tablet it seems to add an AM/PM option which defaults to 'AM' that isn't present at all on the desktop versions. My issue is sometimes these time fields aren't used strictly for inputting a time but also sometimes for measuring the duration of something, where an AM/PM option simply wouldn't make sense.
I've tried Googling for a solution to this problem but I have not been able to find very much information regarding it. Does anyone know why this occurs and how I can turn it off? Is it a system setting on the Nexus or is there an attribute I can add to the time tags to prevent it?
Well I seem to have found the issue myself - the system's language setting was 'English (United States)' which seems to overwrite setting time to a 24-hour format. By changing the language setting to 'English (United Kingdom)' it now obeys the 24-hour format and AM/PM no longer shows in the time fields.
It's pretty annoying that a system setting has to be changed for this rather than being able to do it on a site-by-site basis, but fortunately for this project I do have control over system settings by and large so it has solved the issue for me.
Related
I'm using the Bootstrap 4 datepicker for my web app which I primarily implemented looking at the behaviour in Chrome. Everything works fine there i.e. all the dates are pickable and I only have set a predefined date range that a date is pickable from.
However, now that I've finished implementation based on Chrome's behaviour, I came to realize that none of this is working in Firefox. That is I cannot pick any date at all when the calendar opens up. All the dates are deactivated and not clickable.
I have tried to find the reason for this through a google search but cannot find anything related to this problem.
Any idea why this is happenning and how to fix it?
I want to implement web push notification in my application, however I'm stuck at very simple problem: is there anywhere on the internet resource which would give me complete table for characters limits in web push notification for notification title and body for different browsers/operating systems (I'm interested in Android/Windows 10/macOS and Chrome, FireFox, Safari, Edge, Opera and Yandex browsers)? I've spend quite a lot of time looking over various pages on the internet, however data I encountered there was either incomplete or not up to date or event mutually exclusive between various resources.
Any help will be greatly appreciated.
You don't find any information, because the standard doesn't set a limit.
The text, when too long, is automatically truncated by the browser. The actual limit depends on many variables: the OS, the browser, the layout, the presence of notification fields like images and action buttons.
The only actual limit is the total payload (which includes all fields and the JSON): you should stay below 3kB.
Update: I have made some research for you on the practical limits for each browser and published the results in this blog post.
is possible write counting clock only using HTML5?
Or maybe only counter +1/each second.
Thanks a lot.
I have just written a 12-hour digital clock that uses NO JavaScript. Maybe it wasn't possible when this was first posted, but it definitively is now.
http://notstupid.us/clox/dclock.html
I wrote that on the current Firefox and also tested on the latest Chromium as well as Internet Explorer 11 and Chromium Edge beta. There's currently no way to set it (it always starts at 12:00:00) but I should be able to add that some time (probably using server-side script).
The code is all in one file (with inline CSS).
April 7 2021: I now have a way to set the clock. http://notstupid.us/clox/dclock.php adds a small server-side script to change the animation statements so the clock starts at the current time (US Central time).
That would be frickin cool, but neither HTML5 nor CSS3 have the capacity to do this.
You need to use a real programming language (PHP/JS/Python...).
Markup-Languages(like HTML or CSS) only work declarative.
Since iOS 5 the time input type has been supported by Safari. However, the time is presented in AM/PM format:
Most European countries are using 24h format for presenting time. Is there any way to switch to 24h format? Using datetime-local with locale setting to Dutch didn't work for me.
Using the native time picker is a good choice, however you don't have too much control on the rendering. That remains in the hands of the browser.
Instead of using the native controls, give Mobiscroll Date & Time Scroller a try. You have the possibility to turn AM/PM off and work with 24HR format.
Language packs are available for localization, date format among other features. And provides a great UX for mobile devices.
I am familiair with tools like pagespeed, yslow, firebug, dynatrax.
Sadly they won't help me, because I need to measure it in a browser called PocketBrowser from Motorola (PB2.22) on a PDA(MC55)
So I need some custom plain javascript which can help me get very close to the actual rendering time of a page in that specific browser.
A normal browser is fast enough so I don't have any issues at all there, but in the pocketbrowser it's too slow.