I am trying to create a text highlighter. below is the example of the html structure.
<div id="donthighlight">Sea no iuvaret epicurei conceptam, id dicunt sensibus expetenda</div> <div id="highlightarea">Lorem ipsum dolor sit amet, an zril splendide est, discere accusam</div>
If I select the word “Lorem” from the second div, I should be able to capture the starting character position and ending character position, and add a span tag around it with a class. this will highlight the background of the text temporarily. function should only work within the second div.
I Also want to save those character positions in DB, so that the next time user visit the same article I should be able show the previously highlighted parts. Also user should be able to remove highlights.
I tried a few jquery plugins and was unable complete my requirements. How can I make this work? Any help would be appreciated
Advertisement
Answer
I found exactly what I was looking for. find the link below to the plugin