1

In Firefox, if you do a search (find-in-page), the browser will add lines to the scrollbar for each search-result found to make it easier to see how many search-results there are and where in the page they are located, as seen in the screenshot.

Is this only part of the browser, or is it achievable by a webpage (CSS/JavaScript)? All I can find is information about generic customization of size and shape of the scrollbar, not about marks in the scrollbar.

Screenshot of Firefox with horizontal lines in vertical scrollbar to show results of find-in-page search

Improve this question
6
  • 3
    The feature you're describing is the default browser-based UI. It can be re-created in HTML/CSS/JS though, but you would need a method of finding the matches in the content of the DOM, determining their vertical position, then building the track bar to show their positions within the total document height. It's a straightforward process, but there is a LOT of steps to achieve it. Note that this will appear separately to the browser implementation, not as an integrated part of it Commented Oct 26, 2024 at 15:48
  • default browser-based UI you mean it's the browser-chrome, not the page? Firefox exposes pretty much everything for customization, there's nothing for this, like through the shadow-dom or something, not even via about:config options? Commented Oct 26, 2024 at 16:00
  • default browser-based UI you mean it's the browser-chrome Correct. I tend not to use the word 'chrome' when talking about the UI of the browser to save confusion :) What I can guarantee though is that the document outline shown when searching won't be part of the DOM. I haven't looked in to about:config, but I highly doubt there's anything configurable about it in there Commented Oct 26, 2024 at 18:39
  • Could you explain a bit more what you are wanting to achieve - what is your use case and context? Commented Oct 27, 2024 at 6:26
  • @RoryMcCrossan fair enough, Google really stole that term. 😒 It's a shame this isn't exposed because it's very useful. I found a Reddit thread where someone asked about it and people said you'd have to write it yourself which is apparently a lot of work. 😕 Feel free to post your comment as an answer so I can accept it (not all questions get the desired result 🤷). Commented Oct 27, 2024 at 13:09
Related questions
973
Should CSS always precede JavaScript?
442
Custom CSS Scrollbar for Firefox
743
Targeting only Firefox with CSS
Load 4 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.