DHTMLX Docs & Samples Explorer

Coloring text selection

To set a custom color for the text selection you should use the following technique:

  1. Define a css class with the desired selection colors specified. It's obligatory to use the '::selection', '::-moz-selection' pseudo-elements inside.

    <style>
        .my_style ::selection {
    	color: #454544;
    	background-color: #fffcda;
        }
        .my_style ::-moz-selection {
    	color: #454544;
    	background-color: #fffcda;
        }
    </style>
  2. Set the css class specified before for the required object

    <div id="parentId"></div>
    <div id="objId"> King Arthur is a 2004 film directed by Antoine Fuqua ... </div>
    <div id="objId2" class="my_style">  King Arthur is a 2004 film directed by Antoine Fuqua ... </div>
     
    <script>
        var dhxLayout = new dhtmlXLayoutObject("parentId", "2U");
        dhxLayout.cells("a").setText("Default selection");
        dhxLayout.cells("b").setText("Custom selection");
     
        dhxLayout.cells("a").attachObject("objId");
        dhxLayout.cells("b").attachObject("objId2");
    </script>