Every now and then I need to make a website. And I noted in my last project that background-attachment:fixed; is still not supported by iOS. It is by Safari on MacBooks, so I'm wondering what the story behind it is? Surely it is not a matter of computational cost due to the so-called repainting of the browser's canvas? Because doesn't playing video cost a multitude of that?

Hi Guy's,insteadI hope Apple developers also reading this articles, because the functionality of Safari development for Mac OS and iOS is strongly recomended to be changed.First at all I have working on simple site with css styles and html with small additions of Java and see next bug's (or features) provided by apple team.When I'm using safari 13 Develop console and set up ignore cache feature in Network tab is working for all content (html, fonts etc.) instead css stylesheets files. Css content still got by safari from memory and this is ver stupid idea. Always when I need to see my changes I have clean all cached data from all sites using Cmd + Option + R key combination. This method is unusable.More from this - I have connect iPhone with last iOS and mobile Safari version and do the same. Previous version has clean mobile safari cache when I do this action. Buit new version of Development console cleans only Mac Cache data not mobile cache. So, to check the site new look I need clean all mobile saved data included cache, cookies and other saved using my Safari on mobile device.I can't explain who has develop this, but he should be fired and strongly disabled from availiablity to work in IT for all his life. I really hope the solution is found by this community and I'll be grateful to see answers with solution in this thread. Thanks a lot,Alexander.

I saw this property that I need in the archived docs, https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/doc/uid/TP30001266-_webkit_touch_calloutHow it is now the correct way to disable the defaults callouts? this seems to not working anymoreThanks in advance

Is it expected behavior for Smart Invert to be inverting an image that is defined using the CSS background-image property? Smart Invert works as expected by not inverting an image defined by the <img> HTML tag but does invert the background-image property image.

Does anyone know where I can find the embed code for the Apple Download Badge for apps? I have tried ITunes link Maker but there is no-where on it for Apps. I managed to get the Google badge in seconds but for Apple it seems it’s like trying to find the holy grail. I’ve been through 3 different support contacts who have now referred me here. I would really appreciate any up to date info on how to find the code. many thanks!

After my user shelved Safari for a long time and did not close it (a few days), he was unable to request our webpage. After investigation, it was found that the CDN resource request was not sent out. At the same time, chrome is accessed normally. After restarting Safari browser or dig CDN host, it can be accessed normally. I suspect that it is a cache bug of safari 13. It seems that some cache headers of CDN can trigger this bug, resulting in the failure to request resources normally Reproduce Safari version: 13.0.3, 13.0.5, 13.1.3.

I'm trying to generate a page with a fixed header which has the same color as theme-color and therefore the address bar. I tried to use grid layout or just position: fixed, both have undesired effects. grid, example: https://2qzht.csb.app The content only scrolls with mouse-wheel (or touch on mobile). It's not scrollable on Apple Watch with the crown. fixed, example: https://cdv9k.csb.app Content is scrollable with keyboard and Apple Watch crown. The translucent address bar in Safari 15 now shows the content as it scrolls by and therefore distorting the experience with having the same color at the top of the page including the address bar. I didn't find a fix for the scrolling issue and didn't find anything to disable the translucent address bar or even set the color to the same value as the address bar (including the translucent effect). I found (on some apple pages) that "backdrop-filter: saturate(180%) blur(20px);" might deliver a similar effect, but this is still different than the address bar and breaks if a background-image is used. Is there any way to fix those?

Dose Apple have any official documentation to study HTML/CSS/JavaScript ? Kind Regards

I am printing the contents rendered on a WKWebView using this API. https://developer.apple.com/documentation/webkit/wkwebview/3516861-printoperationwithprintinfo?language=objc The print preview loads fine, but I am unable to print page numbers. I tried overriding the drawPageBorderWithSize method of NSView (since WKWebView inherits from NSView) but that never gets called. I asked a question in the Apple Developer Technical Support and I was asked to use CSS styling to print page numbers. I then tried to use the following solution in CSS: #content { display: table; } #pageFooter { display: table-footer-group; } #pageFooter:after { counter-increment: page; content: counter(page); } <div id="content"> <div id="pageFooter">Page </div> multi-page content here... </div> However, when I try this I only get Page1 at the bottom of the last page. Are there any working solutions for printing page numbers using CSS styling?

I feel this may be a HTML5/Webkit bug related to the canvas element or the way it is repainted (when control comes to that view (I mean page) after going to some other view) when the view is re-rendered, please correct me if this is wrong based on the description. This bug appears to be a generic one observed on iOS 14 & above on both iPhone and iPAD. The bug does not appear till iOS 13.6 (verified on iPAD Air 2019 iOS v13.6) The bug is as follows: The view elements (say text box, input .. esp those at the top) are rendered correctly when the user visits a page first time (e.g. as in goes from page 1 to page 2, then the view elements in page 2 are rendered correctly). Now if the user goes back from page 2 to page 1 & then revisits page 2, the view elements (esp those at the top) disappear. The following video clips can help understand this better: #1 2 mins: https://drive.google.com/file/d/1ycO3YcJeSMA8kmDm6g9ciLUdbEQ-TNbC/view?usp=sharing #2 Less than 25 secs : https://drive.google.com/file/d/1bUBkHQaC0bn6FofLZz2KXTRTg78rF0mx/view?usp=sharing (Please look at both clips) Now if one were to pull and drag down the screen/canvas area at the place where these view elements were originally, then the view elements show up (it's just that they have somehow "gone over the top" after we want back to the earlier page) look at this video clip : https://drive.google.com/file/d/1LKYkqNRrDIE2-f61amMu_gv2QK8lNQf-/view?usp=sharing This bug has been observed in the "HTR Resistor Finder" app using Sencha Touch/Cordova (App store link: https://apps.apple.com/us/app/htr-resistor-finder/id923363496 ). The app has worked perfectly well iOS 7 onwards till iOS 13.6 as also it's working well in all versions of Android 4 onwards till 11, that is the latest Android version. The bug appears to have been introduced due to changes in Webkit in iOS 14 onwards. A bug has been already in Webkit bugzilla https://bugs.webkit.org/show_bug.cgi?id=229231 Please confirm this is being looked into. Hope this can be addressed soon!

On iOS 15 beta, when I tried to check my application, the select element is having issue. As when I clicked on select dropdown, the option list was not shown. The error message was "Failed to present a context menu for configuration with identifier".

hi, after update(ios15.0) of my iPhone12, video element on my website, what im using as video background of website has stopped working. all others browsers is working properly. all i can see is white blank background instead of background video. it looks like video cannot be loaded or played. html: <video playsinline       autoplay       muted       loop       class="uvodna__bg-video" >     <source src="/wp-content/themes/imtsmile2021/video/bg-video.mp4" type="video/mp4" /> </video> can you recommend me some tips to fix that issue? thank you

The following problem: I have built a Blazor app where you can move around elements. To do this I use the events 'pointerdown', 'pointermove' and 'pointerup'. It works on all platforms except the PWA variant on IPadOS 14.0 Safari. The incorrect behavior occurs on several IPads, including an IPad 8th Generation, IPad 3rd Generatio and IPad Pro, After that I built a demo application in which the same error occurs and can be reproduced. To reproduce the error, you must try to move one of the elements (green, blue, purple) directly. If you hold one of the elements for 500ms beforehand, the error does not occur and the selected element can be moved without problems. The link to the demo app is https://pointermove.azurewebsites.net/ The link to the repository is https://github.com/Stefan-at-DEVWARE/PointerMoveProblemPWA

After selecting option using HTML select dropdown and orientation of iPad changes, the dropdown reopens. Is this intended ? What is the reason behind this behavior?

I recently updated my iPhone to iOS 15, but input type="date" text-align:left is not applicable.