React JS : how to fix page jump in android mobile device - android

I am learning reactJS and encountered a weird issue in my web application. When I click a textarea/textfields, the page just randomly scrolls up. But this behavior only happens in android browsers and in android webView.
It looks okay in iOS devices.
Anyone knows why this happens? I have followed a number of suggestions like adding preventDefault() or return false; or even window.scrollTo(0) but none of these works for me.
By the way, I'm using the #react-spring/parallax library if that gives some clue.
Appreciate your ideas! and thank you in advance!

Related

Yii2 <a> / <button> link issues in Android browser

A bit of an odd one here. (I haven't tested it on an iPhone, but the issue may appear there also)
When clicking certain links on an Android phone, the "open with" popup appears. This is a pretty poor experience. I can't work out why it is happening for some links and not others.
The issue can be seen on: http://coursetracker.com.au/university
The issue can be seen when progressing forward on this page, by either searching and clicking [continue] or clicking a university. On a web browser there is no issues, the user continues forward, it only seems to be on a mobile.
The examples on this page are the element, it also happens on elements. I have tried changing links to "_self" with no luck.
Any help or thoughts would be great. Thanks!

ANDROID Ratchet slider not smooth

I've got a webview that I'm displaying that has a couple of Ratchet slider components. I'm noticing that they're nearly un-usable because they'll jerk and jump around as I'm trying to scroll through the options.
Has anyone seen this before? Does anyone have any suggestions on how to fix this?
I haven't seen this issue on iOS, only Android.
Here is a link to the Ratchet documentation.

Trigger.io Notifications: forge.notification.showLoading() not working on Android

According to the documentation, forge.notification.showLoading() should work on both Android and iOS. I'm using:
forge.notification.showLoading('Getting GPS location.');
right before a forge.geolocation.getCurrentPosition(), how ever it doesn't display anything on Android. On iOS I get the expected result. Am I missing something?
I'm testing on two different 4.4.2 (physical) devices, no notification. The code seems to be working, after a bit I do get the Position, and the code continues (closing the loading spinner on iOS) doing some more stuff. For iOS I'm using the Simulator.
Thanks in advance.
So, the problem was that I wasn't using the right params:
forge.notification.showLoading('title', 'body');
iOS only needs the title, but Android does show both title and body. Hope it helps somebody.

tinycarousel scrolling doesn't work in a default android browser

I implemented tinycarousel for my little project and it works almost in all browsers, but scrolling doesn't work in a default android browser and I dunno how to debug it or fix, could anyone help me, please. Maybe anyone have the same issue?
Here is a simple code, which I use for this carousel:
$('#videoResume .videoResumeHolder').tinycarousel({interval: false, pager: true});

Virtual Keyboard does not appear while clicking on text field in Android after using iScroll.js plugin

I am new to phonegap and jqTouch, I am using these for developing Android application.
The problem is, the touch event on textfields working fine on iPhone, but not working on Android, nothing happens when we tap on textfield.
Edit: I came to know that the problem is because the iScroll plugin is being used. When I remove this, the functionality works fine, but I need to use this in my application.
Can anyone tell me what is wrong with iScroll and Android textfields?
Thanks in Advance.
I know the sort of problem you are talking about. When iScroll is being used on a page, it disables the input, select functionality within a form.
It is a known issue and there seem to be a few work arounds out there. Apparently, this is supposed to fix the issue without disabling the iScroll functionality:
In the touchStart function make sure to add the following condition:
if (e.target.tagName != "SELECT")
{
e.preventDefault();
e.stopPropagation();
}

Categories

Resources