Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Modal form input text cursor/caret floats fixed on page when page is scrolled on iPhone #14708

Closed
qdonnellan opened this Issue Sep 30, 2014 · 10 comments

Comments

Projects
None yet
5 participants
@qdonnellan
Copy link

commented Sep 30, 2014

When you open a modal that contains a form and an input element on an iPhone and select the input field (or start typing) the blue cursor/caret will stay fixed on the screen when the screen scrolls until the scrolling action is complete.

Steps to reproduce

  1. On an iPhone, navigate to a page with a form inside a modal, this is a fine example: http://tutsme-webdesign.info/tutorials/contact-modal/Modal-Contact-withpopover.html
  2. Select an input field, notice the blue caret/cursor blinking in the field
  3. Scroll the page with your finger; the blue caret does not move with input field

Desired behavior

When you select an input field and scroll the screen, the blinking blue cursor/caret should move with the input field.


I suspect this is an iOS only problem, and I'm quite frankly not certain if this is bootstrap specific or something that ails the OS as a whole. It seems other libraries have encountered a similar instance of this bug, for example cubiq/iscroll#178 and https://bugs.dojotoolkit.org/ticket/17036 which leads me to believe there should be a fix associated.

@qdonnellan qdonnellan changed the title Monal form input text cursor/caret floats fixed on page when page is scrolled on iPhone Modal form input text cursor/caret floats fixed on page when page is scrolled on iPhone Sep 30, 2014

@cvrebert

This comment has been minimized.

Copy link
Member

commented Sep 30, 2014

Confirmed on iOS 7 with http://jsbin.com/himir/2
Seems like a minor browser bug that's not worth trying to hack around.

@cvrebert cvrebert added the confirmed label Sep 30, 2014

@hnrch02

This comment has been minimized.

Copy link
Member

commented Sep 30, 2014

Also confirmed on iOS 8 with the Bin from @cvrebert.

@qdonnellan

This comment has been minimized.

Copy link
Author

commented Sep 30, 2014

@cvrebert I agree 100%; I do have a client that feels this is a "high priority" issue for them, so take that for what you will.

@gabrielmaldi

This comment has been minimized.

Copy link

commented Oct 1, 2014

@cvrebert linked me here from my SO question. At least glad to hear I'm not the only one feeling this pain 😄

cvrebert added a commit that referenced this issue Oct 30, 2014

@cvrebert

This comment has been minimized.

Copy link
Member

commented Oct 30, 2014

cvrebert added a commit that referenced this issue Oct 30, 2014

Merge pull request #14922 from twbs/ios-cursor-scroll
Add Wall of Browser Bugs entry for #14708
@gabrielmaldi

This comment has been minimized.

Copy link

commented Oct 30, 2014

@cvrebert thank you!

@kamlekar

This comment has been minimized.

Copy link
Contributor

commented Apr 27, 2015

Is there any workaround to fix this issue?

Because I can't find this issue in many other websites like amazon.

@cvrebert

This comment has been minimized.

Copy link
Member

commented Apr 27, 2015

There is no known workaround.

@twbs twbs locked and limited conversation to collaborators Apr 27, 2015

@cvrebert

This comment has been minimized.

Copy link
Member

commented Feb 8, 2016

Seems to have been fixed as of iOS 9.2; see #19119

@cvrebert

This comment has been minimized.

Copy link
Member

commented Mar 11, 2016

Spoke too soon. See #19135

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
You can’t perform that action at this time.