mobile-safari

Overflow-x value ignored in mobile safari

我怕爱的太早我们不能终老 提交于 2019-12-06 02:09:26
问题 We set the overflow-x values to hidden on both the body and scrollable elements, but mobile Safari ignores these values. On the desktop, the overflow values work fine. Relevant code: body { overflow-x:hidden; width:320px; height:100%; min-height:100%; margin:0; background:-webkit-linear-gradient(top,#e8e4dc,#f2f0eb); } .page_list, .content { max-height:370px; box-sizing:border-box; padding:0; overflow-x:hidden; overflow-y:auto; -webkit-overflow-scrolling:touch } #catalog_page { border-left

How can I make a CSS only speech bubble with a border?

可紊 提交于 2019-12-06 01:41:00
I want to make a CSS only speech bubble. So far, I have this... Example CSS div { position: relative; background: #fff; padding: 10px; font-size: 12px; text-align: center; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } div:after { content: ""; display: block; width: 0; height: 0; position: absolute; left: 50%; bottom: -60px; margin-left: -15px; border-width: 30px 20px 30px 20px; border-style: solid; border-color: #fff transparent transparent transparent; } jsFiddle . ...which is almost exactly what I want. However, I want a light border around the whole thing.

Strange JavaScript behaviour on mobile Safari iOS 6

纵然是瞬间 提交于 2019-12-06 00:59:08
I ran into a very very very strange JS issue that is reproducing only on Mobile Safari browser on iOS 6. The issue is in a function that formats a given value to a price, by stripping down the number to 2 decimals and adds the currency in front of the number. Here are the functions. I will explain later on how to reproduce the bug. formatCurrency = function(value, currency, fixedPrecision, colourize, blankIfZero) { var text; if (blankIfZero && (Math.abs(value) < 0.01 || value === undefined)) { return ""; } if (fixedPrecision) { text = currency + Math.abs(value).toFixed(2); } else { text =

UI Automation - how to capture - record using javascript editor

拟墨画扇 提交于 2019-12-06 00:16:07
MobileSafari.app doesn't have accessibility labels is there a way to capture (record) events so that i can use in the javascript for UI Automation? there was a previous post which made that statement but didn't provide any instructions as to how to record using the javascript editor details please thank you in advance! Just open a new script in your Instrument session, and push the little record button at bottom of the page (appears on the screenshot). Now use your app and you should get that kind of stuff: Now you can see the value or the name of your buttons and use it to write your own

Preventing iPhone scaling when rotated

孤人 提交于 2019-12-06 00:12:10
问题 When I rotate my iPhone into landscape mode, the iPhone automatically bumps the text size up. What is the best way to prevent this? I'd like rotation to give the visitor more text to read, not a larger font. Is JavaScript like this the only way to go? 回答1: You could use this CSS property -webkit-text-size-adjust: none; 来源: https://stackoverflow.com/questions/912681/preventing-iphone-scaling-when-rotated

Safari: no Inspectable applications

人走茶凉 提交于 2019-12-05 20:37:37
I have a phoneGap application that I'm developing. I have been running it on an iPad in iOS7. I can use the safari web inspector no problem. But I tried inspecting it on another iPad and saw "no inspectable applications". In Settings > Safari, the web inspector is on. Why won't it work? To inspect an app with Safari's web inspector, the device needs to have a development provisioning profile for that app installed. 来源: https://stackoverflow.com/questions/21051793/safari-no-inspectable-applications

Wrong font size when using float right in CSS on Mobile Safari

荒凉一梦 提交于 2019-12-05 20:21:37
I'm having trouble with a simple CSS-Layout. It works on desktop browsers but not on iPhone's Mobile Safari. Using style="float:right" seems to conflict with automatic font size adjustments made by Mobile Safari. The following code works fine on the desktop but on the iPhone "Left" and "Following text" are much larger than "Right": Left<span style="float:right">Right</span> <p>Following text</p> It seems like Mobile Safari's auto-resizing isn't touching the floated word, only the others. As stated here , I could add -webkit-text-size-adjust: 100% like so: <body style="-webkit-text-size-adjust:

How to solve flicker on iPad when event delegation is used?

筅森魡賤 提交于 2019-12-05 19:57:51
When using the method of event delegation, we set the event handler on a higher level element (parent or grandparent), but this has an issue on iPad's Safari: if the parent element has a click handler, when the user touches anything inside this element, the whole region will gray out (on iOS 5.1), or flicker (on iOS 6). So, if the parent or grandparent is 300 x 300 pixel, and the link is just a word, say 60 x 20 pixel, then when the user touches any where inside the parent (except the link), the whole 300 x 300 region will either gray out or flicker, depending on the iOS version. This is an

web app - device-height / keyboard issue

青春壹個敷衍的年華 提交于 2019-12-05 19:15:13
hope you are able to help me with this annoying problem. I'm currently building a web-app optimizied for Mobile Safari (iOS7). I want my page to be 100% height of the viewport. Currently my page is bigger than the viewport even thought I have specified the height in the css to 100%. The solution to this problem was changing this: <meta name="viewport" content="user-scalable=no, width=device-width, height=device-height, initial-scale=1.0" /> by removing height=device-height the problem is without the height meta tag, the footer is pushed up on the page when I touch/click an input field (when

CSS Scroll Snap visual glitches on iOS when programmatically setting `style` on children

天大地大妈咪最大 提交于 2019-12-05 18:33:15
问题 https://codepen.io/thomaslindstr_m/pen/qJLbwa Pretty bare bones example above. I want to fade out the child I scrolled away from , but when CSS Scroll Snap is enabled, it starts glitching really bad on my iPhone iOS 12.0.1. See video here: https://file-qacepzxlkb.now.sh/ Before the reload I disabled Scroll Snap (JavaScript still running), after the reload, I enable it. Here's the JavaScript: const windowWidth = window.innerWidth; const viewsElement = document.querySelector('.views'); const