Apple has disabled the overflow CSS aspect in mobile Safari so it is not possible to scroll inside a fixed height div. This is quite annoying.
While making an iPhone native app, is it possible to access WebKit settings to turn that feature on ?
You can scroll with 2 fingers.
If you don't want to scroll with 2 fingers, try http://cubiq.org/scrolling-div-for-mobile-webkit-turns-3/16.
WebKit is a private framework, so you can't do anything even if you develop a native app (for AppStore).
Nope. Sorry - you'll have to use js to position things.
It's disabled because you aren't "scrolling", you are moving the viewport, so position-fixed doesn't make sense.
Related
I've run into a problem with Bootstrap's .top-nav only on Safari for iPhone. When scrolling through a .dropdown-menu, after releasing my finger from the phone, it seems to "keep" or "catch" the location my finger was and hover over that list-item, keeping the CSS style for that element's :hover. It doesn't attempt to direct the url anywhere, but it can be a little confusing to the end-user.
This does not happen on my Android phone or in the desktop browser at extra small width (no-touch).
I understand this could be a difficult question to answer, but I'm hoping somebody else has run into this problem on their own and knows the root cause / a fix.
Bootstrap 3, latest version of Safari for iPhone 5. Thank you!
edit: oh, also, this is Bootstrap integrated into Adobe Business Catalyst. I don't think that should make a difference, but it might be worth saying.
Does anyone have ideas about how to implement the scrolling effect as in the iPhone app Applauze in iOS? How to implement this event screen - scrolling effect with the images expanding on scroll up and contract on scroll down in ios.
Here's a solution that uses UICollectionView (instead of UITableView):
https://github.com/syshen/SlipingSlide
iOS 7 has some similar exotic effects in it like the tabs in Safari and the passes in the PassBook interface. I recommend you watch session 217 from WWDC 2013 for more information.
I created my first iOS 5.0 iPhone app and the app's actual size is 480 width by 320 height, which is the default size of the iPhone.
My problem is I don't want the app to allow scrollbars or what I really mean is the ability to scroll past the 320 in height which is happening.
I looked at the Safari Web Content guide here
I still can't seem to figure this out can anyone suggest a fix.
Thanks.
you can do two things. in your css set your main wrapper to overflow:hidden;
also add this to your js onDeviceReady()
document.addEventListener('touchmove',function(event){event.preventDefault()});
that will not allow any scrolling and lock the app down.
NOW if you do want to allow scrolling I suggest looking into iScroll it's really easy to set up and get working, and will give a native look and feel to the scrolling.
I've built a photography site that displays photos side by side, user scrolls though photos using a horizontal scrollbar. (link removed no longer works)
I have used the jscrollpane plugin to customize the look of the scrollbar, but I have disabled it for the time being as I look for a fix. The container is called .scroll-pane.
Can anyone tell me how to get this to work on an iPhone?
Thank you and happy new year
Yeah, that won't work on iOS. You can use two fingers to scroll such an element, but most people are not aware of that.
You should consider a responsive design that adjusts how your site functions in mobile browsers.
I have a webpage with two side by side overflowing divs that split the screen, similar to gmail the iPad. This works fine on desktop versions of WebKit, but is basically broken on iPhone / iPad because scrolling requires two fingers and lacks any momentum.
What is the best way to implement two scrolling areas for the iPad, similar to gmail, the maintain the standard iOS scrolling behavior?
You might consider using SproutCore Touch.