1

I would like to develop a "reader-aid" for my website. When I read long articles on a screen, especially when they're written with a small font, I find myself sometimes lost in the middle of a page, trying to remember which line I had just read. To circumvent this inconvenience, I usally end up selecting the text while reading just to keep track of where I am.

All that to say that I'm looking to develop a script that would automatically detect the cursor position and highlight the entire line whose the mouse positionned over so as to prevent the user from having to do it himself.

I've already explored some options but I haven't found one yet that would solve my issue.

I know for instance it's not feasible to change the properties of the text itself by surrounding it with tags as depending on the screen resolution, the lines might end up at different places.

The best idea I've come up with so far is to use a "floating box" that would move along with the cursor. However, I would appreciate if this box could hang on the lines instead of floating between them.

How could I accomplish this ?

Thanks.

Getter
  • 765
  • 2
  • 6
  • 15

1 Answers1

2

https://www.sitepoint.com/community/t/is-it-possible-to-detect-where-text-wraps/6606

that page's answer suggests wrapping each character in spans using javascript and check the offset values to detect line wraps. Once you detected the line wraps you can wrap wrap a singular line into a span with Javascript and highlight it.

Not sure if that is enough inspiration, without code from your side to work from there is no really objective way to answer this.

user3154108
  • 1,264
  • 13
  • 23