0

Possible Duplicate:
Change CSS of selected text using Javascript

Highlighting text spanning many elements

if (window.getSelection) {
    userSelection = window.getSelection();
    if (userSelection.getRangeAt) {
        var range = userSelection.getRangeAt(0);
    } else {
        var range = document.createRange();
        range.setStart(userSelection.anchorNode, userSelection.anchorOffset);
        range.setEnd(userSelection.focusNode, userSelection.focusOffset);
    }
}

var newNode = document.createElement("span");
newNode.setAttribute('style', 'background-color:yellow');

range.surroundContents(newNode);

This is working for the case of text within the same tag like

in same tag

Since span is inline block element which surrounds the selected text but I am not able to find any working solution for the case which includes other tags also in selected text like..

enter image description here

I am trying to do it for safari browser in ipad.

Do I need to parse the DOM element but I think it would consist of several cases.

Community
  • 1
  • 1
Satish
  • 1,315
  • 4
  • 15
  • 22
  • Yes it is the similar question but it is not working in safari browser of ipad. – Satish Dec 12 '12 at 11:29
  • It definitely does work in iPad. http://jsbin.com/ayivap/3/ – Tim Down Dec 12 '12 at 11:53
  • i am trying in safari browser of ipad simulator but its not working but its working great in desktop safari browser of mac. – Satish Dec 12 '12 at 12:36
  • I don't have the simulator available but it's working on my iPhone and iPad (both running iOS 5). – Tim Down Dec 12 '12 at 12:43
  • @ Tim Down: Still i find it difficult to be happening in ipad safari browser. I tried it but didn't get the result in ipad. – Satish Dec 13 '12 at 09:34

0 Answers0