Styling of search/find-in-page results


#1

Currently it is not really possible to style search/find-in-page results. Some browsers reuse selection style (Firefox), some browsers have special style you cannot style with CSS (Chrome). I think a pseudo-element selector should be provided to change background-color and color properties.

Additionally, some browsers support highlighting all search results (for example, in Chrome, when user selects to “highlight all” matches). This might be another pseudo element?

The use case for this is in Mozilla pdf.js HTML5 PDF library and viewer. It uses HTML5 canvas to render PDF5 content. But for the user to be able to search and select text content of the PDF, a transparent text layer is created above. If you search on the page, you get results, but because text layer is transparent, instead of the result only an empty colorful box is shown. See here:

http://mozilla.github.io/pdf.js/web/viewer.html

Related: Allowing Browser find-in-page to find non-DOM text

I posted this in the past: https://lists.w3.org/Archives/Public/www-style/2014Apr/0025.html