fancybox is working well on my site when seen on computer
but not working(i mean not getting overlays) on viewing in mobile(android native browser). I don't know what is the problem? is it a bug? please help me.
Fancybox is not supported on mobile browsers, largely because it and similar scripts make heavy use of "position: fixed", which is not supported in Mobile Safari and the Android browser.
See: http://groups.google.com/group/fancybox/browse_thread/thread/c1535b2bdefcad58/507ec578bb5347fa
Related
I need to cancel the ios version of chrome's pull-to-refresh for my website.
Currently chrome 69.0.3497.105 doesn't support the css overscroll-behavior
I've tried to implement these existing solutions and could not get them to work:
http://w3bits.com/prevent-chrome-pull-to-refresh-css/
Disable Chrome's pull-to-refresh on iPhone
https://www.npmjs.com/package/prevent-pull-refresh
It still does a pull to refresh on an iPhone. I need confirmation, can anyone get the solutions posted above to work with the newer chrome versions now? Is there a pollyfill that can be used for overscroll-behavior with chrome ios or what alternative can be used to cancel the pull-to-refresh behavior?
I found that the project I was working on had used a cdn to default events to be passive.
<script type="text/javascript" src="https://unpkg.com/default-passive-events"></script>
After realizing this and commenting out the cdn snippet for testing, I found that the solution of:
Disable Chrome's pull-to-refresh on iPhone
does indeed work.
I have some problems with my website. My site is coded in HTML,CSS and JS.
Everywhere works perfect, Desktop (all browsers), Android (All browsers), in iPhone(iOS.11) doesn't work!!!
I think there may be two problems:
1. When i open the site, i have Loading Page script, and in iPhone it stops there and doesnt open the site.
2. The problem may also be with the new iOS 11, because with earlier iOS(10) was working very well.
Any suggestion, or any site which i can check my errors (debugg) or..?
google didn't solve my problem so i decided to ask, but still can't find the problem!!!
Thanks.
If you have an OSX available you can enable remote debug and see what's happening, most likely something is breaking based on something not being available.
Looking for ideas on how to debug instances where JS doesn't work on Safari mobile, works fine on desktop, and then in desktop when I open the Safari console and run the page again using Safari-iOS 9.3-iPhone (which is the version people have had issues on) on a mobile screen it still is working fine.
Thanks!
use can use safari remote debug, you can find a detail steps online
I have an issue with Firefox. In both responsive mode and Firefox Mobile to be accurate.
The touch scrolling isn't working on my website. (But the scroll with the mouse is working on Responsive mode)
It works fine on Chrome mobile & Safari mobile.
I checked online and I already tried the dom.w3c_touch_events.enabled set to 1. It was actually set to 1 by default.
I think it's an issue on the JS/CSS side but I can't see where.
I use SASS and Pleeease to compile it and it's a React app compiled with webpack.
Also I use the method fetch to call my webservices if it can have any influence but I doubt it. (and have a polyfill for it)
I tried to nuke totally my CSS and it still didn't work.
Happy to share URL if people want to see the actual problem. I just don't want to be seen as a spam. Also I will share a test server and not the live one. (problem is the same anyway)
Found the (stupid) solution and posting it as it might be helpful to someone.
I had a overflow:hidden; added by mistake in html, body { into my SASS.
For some reason the responsive mode in Firefox is still not working (bug? cache? I don't know...). But once I tried again on my Firefox mobile it was gone.
Looks like Chrome and Safari are ignoring this CSS but not Firefox.
For the record I am on last versions on all my browsers.
I am using tinyscrollbar to replace the standard scrollbars on desktop versions of my web app. The main reason for this is so that i have a consistent and nice design across all desktop browsers. On an android, mobile ios device and windows mobile device i would just want to use the native scroller. This means that i wouldnt want to include my scroller css nor the javascript for it. If anyone has any experience with this it would be very helpful. I worry about windows 8 machines becuase they are desktops and tablets.
for conditionnal loading, I suggest Yepnope, it is the script loader used in Modernizr (so if you use Modernizr, it's probably already there).
Modernizr.load({
test : Modernizr.touch,
nope : 'slick-scroller.js'
});