How Google Search in Chrome <mark> answers on sites that after scrolling disappear

Question

Google search: republic meaning

1-st result wikipedia.org: -->https://i.imgur.com/dQfBnhG.png<--

It <mark> text and disappear after scrolling. This work on different sites only in Chrome (tried Firefox). How is it made, can I make such thing on my vlog site?

Answer 1

These are called text fragments As arstechnica puts it :

The syntax for this URL is pretty strange looking. After the URL, the magic is in the string #:~:text= and then whatever text you want to match. So a full link would look like this:

 https://en.wikipedia.org/wiki/Cat#:~:text=Most breeds of cat have a noted fondness for sitting in high places

It only seems to be active on Chrome at the moment, because Chrome is the primary pusher of this new extension to the standard. Perhaps that will change in the future.

When on Google, Google (or the browser) will detect that you're on Google and that text links are supported, and will in some cases append the text fragment link to the URL when you click on the link. It's meant to give you a quick indicator of where to look on the page when you first load the page , which is why, after you start scrolling, it disappears.

On supported browsers, you can add text fragments to the URL to highlight. For example, for this Stack Overflow page, you can use the link:

https://stackoverflow.com/questions/64684251/how-google-search-in-chrome-mark-answers-on-sites-that-after-scrolling-disappe#:~:text=disappear%20after%20scrolling

here , which gives you:

On browsers which do not support this yet, the text fragment in the URL just won't do anything.