I have a single view appication where I am trying to load jQuery Demos from this site:
http://jquerymobile.com/demos/1.0rc2/ on a UIWebView.
But when I click on a component from the demo, I can see a white screen flickers for few milli seconds and only it happens in portrait mode (for landscape it does not appear so). I have spent almost an entire day digging into this, yet no success. I have already posted this query to jQuery mobile forum but have not got any reply yet.
I'm not sure whether it's a bug in UIWebView or in jQuery site.
any help is truly appreciated.
Finally fixed the issue, it's something with CSS for webkit. For this you need to call stringByEvaluatingJavaScriptFromString on your UIWebview object and pass the parameter which is something like this:
[yourwebviewObject stringByEvaluatingJavaScriptFromString:#"$(document).ready(function(){"
"$('head').append('.ui-page {"
"-webkit-backface-visibility: hidden;"
"}')"
"});"];
Hope it will help out there someone.
Related
I need help making my web site iframe scroll on the ios8 ipad.
https://secure.gymnasticseast.com/4dcgi/1/class_manager.a4d?loc=bellevue
This shows an iframe the slides horizontally, but does not move at all vertically.
I've tried all of the combinations of css, inline styles suggested here to get it to work, but none have yet to scroll vertically on the iPad.
Please help!
Thanks!!
In my experience IFrames an Framesets don't work on Safari mobile, there are other solutions that do work depending on the problem.
Follow this link that confirms that.
I want to create a wysiwyg-editor for ipad and have a toolbar with position:fixed - so that it's always available.
However, when I focus on div with contentEditable="true" the toolbar is not fixed any more.
Is this a bug?
Is there a workaround?
just found this while looking for the same thing - for the same reason...
we have a half-way solution to the toolbar, but it sort of wanders off-page and then resets to the correct position when the scroll finally stops. The solution isnt pushed to github yet, but it will be in the next couple of days. Best approach we have so far is a chunk of JS that forces the div back in place if we recognise we are working on iOS :-(
But you might want to check the editor we built in any case :-) http://www.quink.mobi or https://github.com/IMD-Business-School/Quink.
This is frustrating and I have seen and tried many answers but still end up with a zoomed effect on my webpage when I view on iOS. I have experimented with various viewport settings but the initial view is always zoomed.
Here is the experimental link. The page has a fixed header and footer and looks and functions fine in web browsers but in iOS it looks zoomed in. If I double tap, it resumes the desired view.
http://jbrubaker.fatcow.com/dealer/index2.html
Viewport settings:
Is it a CSS issues?
A fixed element issue?
Thanks in advance.
Assuming that you are using UIWebView to view the site.
Set the BOOLEAN scalesPageToFit property of your UIWebView to YES.
This would hopefully solve your issue. If not then get back with your comments
I am showing a twitter feed in a uiwebview... however there is a problem: it appears significantly differently in the uiwebview then what it does in mobile safari. Ultimately, I much prefer the look of the feed as it is shown in mobile safari. Is there any way to 'trick' the web view into displaying itself as safari? Possibly by altering the user agent? Thanks.
Ended up altering the user agent. App made it past apple review fine.
UIWeView and Safari doesn't display all the pages as the same..There can be minor differences in formatting in UIWebView which won't be found in Safari..
Solution to this is to use javascript to alter the WebView itself programmatically to display things right..
more info avaialble in UIWebView Class Reference doc here
I am very new to HTML5 development for ipad. I am creating my first application for ipad using HTML5. Everything is done except I am facing one problem. Problem description is.
There is one vertical overflowing div. This page is viewed properly in computer's browser but when the same page is viewed in ipad the overflowing section is cutoff and it appears that there is no overflowing content.
Please let me know the proper way of doing it.
On the iPad scrollable div's using overflow scrollbars will not appear on that div. The only way to scroll is using a two finger swipe.
Joe says that Scrollability is not yet ready to be used, so I wouldn't implement it in a production system.
To do this you have other options like:
http://cubiq.org/scrolling-div-on-iphone-ipod-touch
You want native-like scrolling on the iPad in your HTML5 application? You might want to check out a project called Scrollability by Joe Hewitt: http://joehewitt.github.com/scrollability/
Check out https://github.com/appmobi/aux_web (aUX_webScroll) . I'm the author, so if you have any questions, let me know.
iOS5 has the new property to allow scrolling on divs, but you'll find out that when you use it in a webview, the whole webview moves too and surprisingly, not everyone upgrades the OS.
I wrote an article about new features in iOS 5. Also this topic is covered on section -webkit-overflow-scrolling: http://samuli.hakoniemi.net/ios-5-and-new-features-for-web-developers/#webkit-overflow-scrolling