javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 03:32:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(labels): improve floating labels focus

Browse Source 
Closes #613
This commit is contained in:
Adam Bradley
2015-11-25 21:55:57 -06:00
parent ef488b27c4
commit 194c964dfb
3 changed files with 38 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
ionic/components/text-input/text-input.ts
View File

@ -449,11 +449,7 @@ export class TextInputElement {
let focusedInputEle = this.getNativeElement();
if (shouldRelocate) {
let clonedInputEle = focusedInputEle.cloneNode(true);
clonedInputEle.classList.add('cloned-input');
clonedInputEle.classList.remove('hide-focused-input');
clonedInputEle.setAttribute('aria-hidden', true);
clonedInputEle.tabIndex = -1;
let clonedInputEle = cloneInput(focusedInputEle, 'cloned-input');
focusedInputEle.classList.add('hide-focused-input');
focusedInputEle.style[dom.CSS.transform] = `translate3d(-9999px,${inputRelativeY}px,0)`;
@ -478,10 +474,7 @@ export class TextInputElement {
let focusedInputEle = this.getNativeElement();
if (shouldHideFocus) {
let clonedInputEle = focusedInputEle.cloneNode(true);
clonedInputEle.classList.add('cloned-hidden');
clonedInputEle.setAttribute('aria-hidden', true);
clonedInputEle.tabIndex = -1;
let clonedInputEle = cloneInput(focusedInputEle, 'cloned-hidden');
focusedInputEle.classList.add('hide-focused-input');
focusedInputEle.style[dom.CSS.transform] = 'translate3d(-9999px,0,0)';
@ -526,6 +519,16 @@ class InputScrollAssist {
}
function cloneInput(srcInput, addCssClass) {
let clonedInputEle = srcInput.cloneNode(true);
clonedInputEle.classList.add(addCssClass);
clonedInputEle.classList.remove('hide-focused-input');
clonedInputEle.setAttribute('aria-hidden', true);
clonedInputEle.removeAttribute('aria-labelledby');
clonedInputEle.tabIndex = -1;
return clonedInputEle;
}
const SCROLL_ASSIST_SPEED = 0.4;