javascript - 鼠标悬停时突出显示文本行

标签 javascript jquery css html

<分区>

我想为我的网站开发一个“阅读器辅助”。 当我在屏幕上阅读长篇文章时,尤其是当它们是用小字体书写时,我发现自己有时会迷失在一页的中间,试图记住我刚刚读过的那一行。为了避免这种不便,我通常最终会在阅读时选择文本,以跟踪我的位置。

综上所述,我正在寻求开发一个脚本,该脚本可以自动检测光标位置并突出显示鼠标所在的整行,从而避免用户必须自己执行此操作。

我已经探索了一些选项,但还没有找到可以解决我的问题的选项。

例如,我知道通过用标签包围文本来更改文本本身的属性是不可行的,因为根据屏幕分辨率,行可能会出现在不同的位置。

到目前为止我想出的最好的主意是使用一个会随着光标移动的“ float 框”。但是,如果这个盒子可以卡在线上而不是漂浮在它们之间,我将不胜感激。

我怎样才能做到这一点?

谢谢。

最佳答案

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

该页面的答案建议使用 javascript 将每个字符换行并检查偏移值以检测换行。检测到换行后,您可以使用 Javascript 将单行换行并突出显示。

不确定这是否足以激发灵感,如果没有您身边的代码来工作,就没有真正客观的方法来回答这个问题。

关于javascript - 鼠标悬停时突出显示文本行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48222915/

相关文章:

css - 切换嵌套元素中的 CSS 属性

jquery - Bootstrap Navbar Hamburger 菜单无法打开,下方有容器

html - 将 CSS 加载到 HTML 文档中

javascript - 这会在 IE 中泄漏吗?

javascript - this.appendChild 不是一个函数

javascript - 将 keyup 事件从文本字段更改为下拉菜单

jQuery 文本交叉淡入淡出

javascript - 使用 odata 自定义 orderBy?

javascript - 在 Javascript 类中使用 const

javascript - 如何(某种程度上)向 fullcalendar 的 renderEvents 处理程序添加代码?