- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
As you may see, in the images, the same page, sometimes appears blurred and sometimes not.
Only on iOS (tried on iPhone 6).
Why? what I have to change in my css? thank you
- Tags:
- HTML5
- Intel® XDK
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
This seems to be an issue with the content being rendered by the webView. I recommend trying the following CSS on the body:
body { -webkit-perspective: 0px !important; -webkit-backface-visibility: visible !important; }
There can also be an issue with the framework that you are using as well.
You can also force the view to be repainted by using the following line in your CSS
body { -webkit-transform: translate3d(0,0,0); }
Link Copied
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I recommend using images that follow Apple's 1x, 2x, etc guidelines.There is an attribute for the <img> tag that allows you to list the image files of which will be used based on the device platform model. For more information visit http://www.webkit.org/demos/srcset/. iPhone 6 images are expected to follow the 2x guidelines to allow for the best visual quality when rendered on the device's Retina Display.
Also, make sure you are setting the appropriate attributes for the meta tag with viewport.
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=no">
For more information on Apple device support for HTML content visit https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
as You may see, not only images, also text is blurred
So I think images are not the problem, maybe some setting like -webkit-perspective: 0; would fix the problem?
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
This seems to be an issue with the content being rendered by the webView. I recommend trying the following CSS on the body:
body { -webkit-perspective: 0px !important; -webkit-backface-visibility: visible !important; }
There can also be an issue with the framework that you are using as well.
You can also force the view to be repainted by using the following line in your CSS
body { -webkit-transform: translate3d(0,0,0); }
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
This could be related to the framework that you are using or the application logic in your project.
What framework are you using?
I recommend creating a basic project with at least one icon, button or clickable UI element and evaluate the click response.Your issues could be related to one of the two observations mentioned above.
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark
- Subscribe
- Printer Friendly Page