Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Focus while clicking scrollbars

  • 1 reply
  • 0 have this problem
  • Last reply by Ashik T

more options

Issue Description: Typically, clicking on scroll bars doesn't cause the currently focused element to lose focus. However, when I click the scrollbar of an element with tabindex set to '-1', the focus is lost from the currently focused element. I'm unsure if this is the intended behavior or not, but it seems odd to me. I would appreciate it if someone could clarify whether this is a bug or intentional.

Steps to reproduce: 1. Focus on the input element. 2. Click on the scrollbar of the `ul` element.

You'll notice that the input element loses its focus. However, if you remove the `tabindex` attribute from the `ul` element and then click on the scrollbar, the input element retains its focus.

Sample code:

<input type='input'/>

  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
  • option
'''Issue Description''': Typically, clicking on scroll bars doesn't cause the currently focused element to lose focus. However, when I click the scrollbar of an element with ''tabindex'' set to '-1', the focus is lost from the currently focused element. I'm unsure if this is the intended behavior or not, but it seems odd to me. I would appreciate it if someone could clarify whether this is a bug or intentional. '''Steps to reproduce''': 1. Focus on the input element. 2. Click on the scrollbar of the `ul` element. You'll notice that the input element loses its focus. However, if you remove the `tabindex` attribute from the `ul` element and then click on the scrollbar, the input element retains its focus. '''Sample code''': <input type='input'/> <ul style='height: 200px; overflow: scroll; width: 200px' tabindex='-1'> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> <li>option</li> </ul>

All Replies (1)

more options

Apologies, the sample code got displayed here—it's something like this: " < input type='input'/> < ul style='height: 200px; overflow: scroll; width: 200px' tabindex='-1'>

 < li >option< / li >
 < li >option< / li >
 < li >option< / li >
 ....

< / ul> "

Modified by Ashik T

Helpful?

Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.