1

I have something like this:

<div class="content" contenteditable="true">
  <p>Some text</p>
  <p>Some other text</p>
</div>

Right now I can do .content p:hover (e.g. color: red) to manipulate the CSS. But that only works with the cursor.

How can I do it so I can manipulate CSS based on the caret's position (specific paragraph)?

alexchenco
  • 53,565
  • 76
  • 241
  • 413
  • Can you show the markup of the caret? – cport1 Oct 29 '14 at 13:39
  • 1
    can you describe a bit that final effect you want to achieve ? Highlighting up to a specific (*hovered*) letter ? or a specific paragraph ? – Gabriele Petrioli Oct 29 '14 at 13:40
  • how can you place a caret into the paragraph? is it about a Wysiwig editor? – Fabrizio Calderan Oct 29 '14 at 13:42
  • Im unsure what you want - do you want the latter you are hovering on to be red? If you are looking for text-selection within the paragraph to be styled, you can use the `::selection` pseudo-element. Otherwise, if its the former you can't do it as individual letters are not elements. – somethinghere Oct 29 '14 at 13:46
  • 1
    http://jsfiddle.net/p375c3ys/ – dfsq Oct 29 '14 at 14:22

0 Answers0