tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

highlight-image.html (933B)

      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4    <meta charset="utf-8">
      5    <title>Custom highlight pseudo elements over images.</title>
      6    <link rel="help" href="https://drafts.csswg.org/css-highlight-api-1/#creating-highlights">
      7    <link rel="mismatch" href="highlight-image-notref.html">
      8    <meta name="assert" content="Highlights should be able to be specified over images.">
      9    <style>
     10    ::highlight(example-highlight1) {
     11        background-color: rgba(200,0,0,.5);
     12        color:green;
     13    }
     14    </style>
     15 </head>
     16 <body>
     17    <div id="img1"><img src="../../images/blank-highlight.png"></div>
     18 
     19    <script>
     20        let imageElement1 = document.getElementById('img1');
     21        let highlight1 = new Highlight(new StaticRange({startContainer: imageElement1.childNodes[0], startOffset: 0, endContainer: imageElement1.childNodes[0], endOffset: 1}));
     22 
     23 
     24        CSS.highlights.set("example-highlight1", highlight1);
     25    </script>
     26 </body>
     27 </html>