Rangy : how to implement Multiple style?

Question

Rangy : how to implement Multiple style?

119 views Asked by me Ya At 28 October 2021 at 17:49

im using Rangy for highlighting text in my web page. is there a way to set multiple styles for user to choose for highlighting text ? for example when user click on some yellow highlight, i take all of the text with getHighlightForElement() method but i dont know how to change the color class/id ? or any other way suggestion? thank you !

Original Q&A

There are 1 answers

**EthanBlaisAlarms** · Answer 1 · 2021-10-28T18:06:41+00:00

The code below is a simple stylesheet swapper. When you click on the "Highlight 1" button, it will load a stylesheet named "highlight1.css". The stylesheet will be swapped out when you click a different button.

<html lang="en">
  <head>
    <link href="default_highlight.css" rel="stylesheet" type="text/css" id="highlight">
    <script>
      function setHighlight1() {
        const highlight = document.getElementById('highlight');
        highlight.href = 'highlight1';
      }
      function setHighlight2() {
        const highlight = document.getElementById('highlight');
        highlight.href = 'highlight2';
      }
      function setHighlight3() {
        const highlight = document.getElementById('highlight');
        highlight.href = 'highlight_3.css';
      }
    </script>
  </head>
  <body>
    <button onclick="setHighlight1()">Highlight 1</button>
    <button onclick="setHighlight2()">Highlight 2</button>
    <button onclick="setHighlight3()">Highlight 3</button>
  </body>
</html>

Hopefully this answers your question.

TechQA.

Rangy : how to implement Multiple style?

There are 1 answers

Related Questions in JAVASCRIPT

Related Questions in RANGY

Popular Questions

Popular Tags

Trending Questions