0

I'm using a jQuery date picker plugin for one of my projects (Zebra Datepicker), which requires using input fields. The problem is that while testing the site on iPhone 6 (running iOS8), when I tap on the corresponding input field, the calendar appears with the default dark blue blinking cursor (pipe) above the calendar (and it's not a z-index issue). Here's the screenshot:

enter image description here

The given bug won't reproduce on the devices running iOS versions lower than 8.

Any known workaround on how to hide this annoying cursor at all? I consider both CSS and JS-based solutions.

Thanks!

Balabeque
  • 307
  • 3
  • 16
  • Is there a link you can share, that uses the same date picker plugin – Web pundit Sep 21 '15 at 19:01
  • @Webpandit, here's a test link that contains a part from the page that uses the above-mentioned plugin: [TEST LINK](http://mad.faipapps.com/hmcards/test_test) – Balabeque Sep 21 '15 at 19:20
  • I would say that you'd have to switch the focus from the input widget to the calendar first day you can select. Only it looks like you need to have the focus in that input widget for things to work? – Alexis Wilke Sep 21 '15 at 20:04

2 Answers2

1

I had same problem and I solved it.if you prevent to zoom on ios this worked for me you can test it

fotenoot: it's working on ios devices too. (I checked)

.selector {
  text-shadow: 0 0 0 gray;
  color: transparent !important;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none; // latest Opera versions support -webkit-
  user-select: none;
  &:focus {
    outline: none;
  }
}
<input type="text" class="selector">
Fırat Abak
  • 11
  • 1
0

I don't have an ios device to test at the moment, but this thread Disable blinking cursor in UITextField? might solve your problem

Community
  • 1
  • 1
Web pundit
  • 398
  • 3
  • 10
  • I think the OP means the browser, not iOS storyboard interface objects :-). –  Sep 21 '15 at 20:02