demo · v140

highlightsFromPoint

Three Custom Highlights are painted on the paragraph below. Hover anywhere over the text — the readout shows which highlights live at that exact pixel, via document.highlightsFromPoint(x, y).

note quote error

Hover the text:

A note is a short remark that adds context. "A quote sits inside, distinct from the rest." Sometimes a passage contains an erorr — a typo or misspelling — that we want to call out specifically.

Highlights at the pointer:

Move pointer over the text…
const hits = document.highlightsFromPoint(e.clientX, e.clientY);
for (const entry of hits) {
  // entry.highlight is the Highlight
  console.log(entry.highlight);
}

see also