programmatically changing webkit-transformation values in animation rules

Use the CSSOM var style = document.documentElement.appendChild(document.createElement(“style”)), rule = ” run {\ 0% {\ -webkit-transform: translate3d(0, 0, 0); }\ transform: translate3d(0, 0, 0); }\ }\ 100% {\ -webkit-transform: translate3d(0, ” + your_value_here + “px, 0);\ transform: translate3d(0, ” + your_value_here + “px, 0);\ }\ }”; if (CSSRule.KEYFRAMES_RULE) { // W3C style.sheet.insertRule(“@keyframes” + rule, 0); } … Read more

Eliminate 300ms delay on click events in mobile Safari

Now some mobile browsers eliminate 300 ms click delay if you set the viewport. You don’t need to use workarounds anymore. <meta name=”viewport” content=”width=device-width, user-scalable=no”> This is currently supported Chrome for Android, Firefox for Android and Safari for iOS However on iOS Safari, double-tap is a scroll gesture on unzoomable pages. For that reason they … Read more

Distinguish Chrome from Safari using jQuery.browser

Since Sarfraz has not corrected his answer (thank you Sarfraz for pointing me in the correct direction), I will post functioning code here. var userAgent = navigator.userAgent.toLowerCase(); $.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase()); // Is this a version of Chrome? if($.browser.chrome){ userAgent = userAgent.substring(userAgent.indexOf(‘chrome/’) +7); userAgent = userAgent.substring(0,userAgent.indexOf(‘.’)); $.browser.version = userAgent; // If it is chrome then jQuery … Read more

Safari JS cannot parse YYYY-MM-DD date format?

The behavior of the Date.parse method is implementation dependent, on ECMAScript 5, this method can parse ISO8601 formatted dates, but I would recommend you to make the parsing manually. Some time ago I’ve made a simple function, that can handle a format specifier argument: function parseDate(input, format) { format = format || ‘yyyy-mm-dd’; // default … Read more

Disabling Safari autofill on usernames and passwords

The reason browsers are ignoring autocomplete=off is because there have been some web-sites that tried to disable auto-completing of passwords. That is wrong. And in July 2014 Firefox was the last major browser to finally implement the change to ignore any web-site that tries to turn off autocompleting of passwords. June 2009: IEInternals blog where … Read more

Is there a way to apply styles to Safari only?

UPDATED FOR MONTEREY & SAFARI 15 (early 2022 Update) * PLEASE PLEASE — If you are having trouble, and really want to get help or help others by posting a comment about it, Post Your Browser and Device (MacBook/IPad/etc… with both browser and OS version numbers!) Claiming none of these work is not accurate (and … Read more

Programmatically play video with sound on Safari and Mobile Chrome

Yes, you can bind on event that are not directly ones triggered on the video element: btn.onclick = e => vid.play(); <button id=”btn”>play</button><br> <video id=”vid” src=”https://dl.dropboxusercontent.com/s/bch2j17v6ny4ako/movie720p.mp4″></video> So you can replace this button with any other splash screen requesting an user click, and you’ll be granted access to play the video. But to keep this ability, … Read more