Comments (13)
From what I've read and tested, I do think that it's a bug in Android browser. Since I haven't really tested with many Android versions (only 2.3.3), I'm not completely sure about it.
Quote:
"This issue seems to be that WebKit on Android takes CSS "overflow: auto" and "overflow:
scroll" as "overflow: hidden", this is going to break a fair number of sites that use
this to allow scrolling boxes within the page."
However it should be fixed in Android version 3. I can't verify it since I don't have a device to test with.
nanoScroller also does not work on iOS versions less than 5.
Any workarounds to fix support for older mobile browsers would be appreciated.
More info:
http://code.google.com/p/android/issues/detail?id=2118
http://fioravengi.blogspot.com/2011/06/why-custom-scrolling-is-still-required.html
from nanoscrollerjs.
In honeycomb the scroll works well, but the .pane .slider don't move, looks like a positioning issue.
Tested on 3.2.
Great job, seriously, ;)
from nanoscrollerjs.
I made iOS5 related fixes in 5d471b9. Anyone able to test if it also fixed the scrollbar for Android 3+ ?
from nanoscrollerjs.
Continues the same problem as before, : (
from nanoscrollerjs.
@emmgfx thanks for testing it. Support for android is difficult to fix, because I don't have a device for Android testing.
from nanoscrollerjs.
I will do the necessary tests, and if I have time I will try to fix it, although I have little idea. The problem is that the scroll bar (.nano > .pane > .slider) does not move with the content.
from nanoscrollerjs.
The issue can be polyfilled quite neatly with Overthrow.js from the Filament Group, it plays fair with nanoScroller.
This is my current testing rig (working on Android 2.3.3 and iOS 4)
if (overthrow && overthrow.support !== 'none' && $.fn.nanoScroller)
{
$('.overthrow').nanoScroller({ contentClass: 'overthrow-content' });
}
from nanoscrollerjs.
Nice :) @i-like-robots would you like to update nanoScroller README with more info about polyfilling for Android/iOS4? Would be great for better mobile support.
from nanoscrollerjs.
Sure, no problem
from nanoscrollerjs.
I tested out your polyfill trick, and it really seems to fix the lacking mobile support. Thanks @i-like-robots, you're the man!
from nanoscrollerjs.
@ibalpinar, @emmgfx or @i-like-robots. Can anyone of you help me and do a quick test on Android to see if using the overthrow.js polyfill fixes nanoScroller for Android 2 or 3? Would be nice to know what the Android situation really is.
from nanoscrollerjs.
It works for Android 2.2 and 2.3 in native browser and Opera 11.6. Firefox for Android supports overflow:scroll natively. I'll do more testing this week to confirm.
from nanoscrollerjs.
Hey guys, sorry for the late reply. I tested out all possible mobile devices and it all works fine. Thanks for your supports and replies.
from nanoscrollerjs.
Related Issues (20)
- Several classes for sliders (and panes, maybe)
- alwaysVisible doesn't make scrollbar always visible
- Nanoscroller doesn't scroll browser window when user is pulling down scrollbar slider with the mouse HOT 1
- dynamic content HOT 3
- In firefox for linux, default scroll bar is shown beneath nanoscroller .pane HOT 4
- scrollbar not visible
- No source files on NPM? HOT 4
- How to implement lazy-load images HOT 2
- Multiple Nanoscrollers. HOT 1
- Prevents click events on Windows 8 HOT 1
- Save scroll position HOT 4
- Top attribute on parent container shortens scroller HOT 1
- it has some delay in low internet speed mode! HOT 2
- Child Scrolling issues. HOT 2
- Unable add nano scroll on body element? HOT 1
- [QUESTION] Where I can find the CI service?
- Apple ipad 4 in Chrome default scrollbar is visible. what could be the reason? And how to fix? HOT 1
- is there any support for react?
- Slider not draggable - Right click and drag works but left click not working (fullpage.js)
- broken url
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from nanoscrollerjs.