It seems like the content served by Azure B2C for Sign In has "autofocus" property set on some html element. It causes my web page to scroll down on small screens (e.g. on mobile). <button class="accountButton firstButton claims-provider-selection" id="ABC" role="link" autofocus>Employee Sign In</button> Is there a way to disable this "autofocus" on policy level? PS. I know it could be handled using custom javascript, but e.g. scrolling to the top not always work.

Hi @Jan Borowiak , the closest thing that we have for this are UI Templates , but unfortunately nothing built-in for autofocus on the policy level. You'd have to use JavaScript for this. If you're interested in learning how to do this I can help you! Please let me know if you have any questions. If this answer helped you please mark it as "Verified" so other users can reference it. Thank you, James

How to turn off autofocus on Azure B2C Sign In page

Accepted answer

James Hamil 24,136 Reputation points Microsoft Employee

2023-03-21T21:48:02.7833333+00:00

Hi @Jan Borowiak , the closest thing that we have for this are UI Templates, but unfortunately nothing built-in for autofocus on the policy level. You'd have to use JavaScript for this. If you're interested in learning how to do this I can help you! Please let me know if you have any questions.

If this answer helped you please mark it as "Verified" so other users can reference it.

Thank you,

James
Please sign in to rate this answer.
Jan Borowiak 50 Reputation points

2023-03-22T09:14:56.78+00:00

>If you're interested in learning how to do this I can help you!

Yes, please, would be good to learn this.
The desired state is that the user see the top of the page after reload (not the page scrolled down to the autofocused button, which often happens on mobile). I've tried different solutions:

scrollTo(0,0)

focus() on the first interactive element on the page (document.getElementById('id-of-the-other-element').focus())

turning off the autofocus (document.getElementById('id-of-the-focused-element').autofocus = false)

But all of them failed at some cases. Eventually, I used setTimeout and scrollTo(0,0), but this is not the best solution. Probably utilizing "window load" event could help, but I'm not sure if it's possible with B2C UI Templates (https://learn.microsoft.com/en-us/answers/questions/1191409/how-to-use-window-load-event-on-azure-b2c-pages)
Sign in to comment

Use comments to ask for clarification, additional information, or improvements to the question.

Share via

How to turn off autofocus on Azure B2C Sign In page

0 additional answers

Your answer