AlertifyJS
AlertifyJS copied to clipboard
Popup defaultFocus speed
Hi, When oppening a popup there is a delay between the click and the defaultFocus button to be focused, in a batch work it is not possible to do a quick [click] -> [enter] action because of the delay, resulting on a 2 button press (one by click and the second by enter press on the samme button).
Is there a way to reduce this delay?
thank you!
Hi,
This is due to waiting for the animation to end, and then the focus is set. You can reduce this by decreasing the In/Out animation duration. For example:
.alertify.ajs-in:not(.ajs-hidden) .ajs-dialog,
.alertify.ajs-out.ajs-hidden .ajs-dialog {
animation-duration: 150ms;
}
Thanks.
hi, Thanks for the quick reply =). I try the CSS modification and it does work but the lost of the animation is a sad cost =( I'm using the "flipx" animation and for a short duration like this the animation is not there anymore... I supose there is no tweak that i can try? thanks!
Increase it gradually till you get a duration that best suits your use case.
ok, then, to log my final result, since the default time is ".5s" and this problem is only related to the "In animation" I add this class :
.alertify.ajs-in:not(.ajs-hidden) .ajs-dialog {
animation-duration: 0.3s;
}
this is not the perfect solution but it will work for some fast typing people. thank you!
Would disabling the animation work better?
it would work better but not lock better. I do want the animation but i was trying to get a solution where the button get focus from the beggining and not at the end. I think the user should be able to just press ENTER without needing to wait for the end of the animation.
@seltix5 The waiting is required due to .focus()
having no effect on hidden elements. Thus we wait for the animation end to make sure the element is visible.
yes I understand. Maybe, is it possible to store the focused object and blur it on prompt open? this way if the enter key is pressed again it will not trigger the prompt again. Then on promp close, focus the stored object again. Can I do that with events callback? thanks
The issue is with releasing the key. If one of the dialog buttons receives focus immediately, it will fire keyup
event and perform it's action.
I need to look further into this.
since is not possible to focus the dialog button from the start, as you correctly said, because its not possible to focus hidden elements, maybe a workaround wold be to blur all focus on promp open
How about on first show, if the element is focusable , focus it otherwise delay set focus when animation is finished?
@AzzaAzza69 See https://github.com/MohammadYounes/AlertifyJS/issues/150#issuecomment-312935420.