光标停止闪烁

本贴最后更新于 222 天前,其中的信息可能已经东海扬尘

鼠标点击编辑器任意位置
会出现【光标】
光标一闪一闪的

希望光标不再闪烁,就是一个竖线

/* 停止光标闪烁* /
.protyle-content {
caret-color: transparent !important; /
隐藏光标 /
animation: none !important; /
禁用闪烁动画 */
}

这是 gemini2.5 写的代码
只能让光标隐藏

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    28444 引用 • 119764 回帖
  • Q&A

    提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。

    11153 引用 • 50648 回帖 • 52 关注

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • 昨天试用了下,体验不是很好,哈哈。

    不过,看你这么执着,就让 deepseek 帮忙写了个。

    [js] 编辑器自定义光标(支持顺滑光标 / 是否闪烁 / 自定义样式等)

  • 其他回帖
  • 有啥软件的光标不会闪?

  • wilsons 1

    其实也不是不能实现,就是较麻烦,需要自己模拟光标。

    可参考这位大佬的插件 【焦点写作 |ZenType】聚焦、打字机与顺滑光标的插件

  • 365
    // --- 光标显隐控制:基于鼠标按住时长 ---
    
    (function() {
        if (window.caretVisibilityByHoldInitialized) {
            return;
        }
        window.caretVisibilityByHoldInitialized = true;
    
        const HOLD_DURATION_THRESHOLD_MS = 400; // 0.6秒
        const HIDE_CARET_CLASS = 'custom-hide-caret-on-short-hold'; // 新的类名,避免与之前冲突
    
        let mouseDownTimestamp = 0;
        let holdTimer = null; // 用于 mousedown 后超过阈值自动显示光标的定时器
        let editorTarget = null; // 记录 mousedown 发生时的可编辑目标
    
        // --- 添加 CSS 规则 ---
        const styleElement = document.createElement('style');
        styleElement.textContent = `
            body.${HIDE_CARET_CLASS} .protyle-wysiwyg div[contenteditable="true"],
            body.${HIDE_CARET_CLASS} .protyle-title__input,
            body.${HIDE_CARET_CLASS} textarea.b3-text-field {
                caret-color: transparent !important;
            }
        `;
        document.head.appendChild(styleElement);
        // ---
    
        // 监听整个文档的 mousedown,以捕获所有可能的编辑器点击
        document.addEventListener('mousedown', function(event) {
            // 只处理鼠标左键
            if (event.button !== 0) {
                return;
            }
    
            // 检查点击目标是否在我们关心的可编辑区域内
            const target = event.target.closest('div[contenteditable="true"], .protyle-title__input, textarea.b3-text-field');
            if (!target) {
                // 如果点击在非编辑区域,我们可能希望光标恢复显示(如果之前是隐藏的)
                // document.body.classList.remove(HIDE_CARET_CLASS); // 可选:点击非编辑区恢复光标
                mouseDownTimestamp = 0; // 重置时间戳
                clearTimeout(holdTimer); // 清除可能存在的定时器
                editorTarget = null;
                return;
            }
            editorTarget = target; // 记录当前操作的编辑器目标
    
            mouseDownTimestamp = Date.now();
            // console.log("Mousedown at", mouseDownTimestamp);
    
            // 清除上一个可能存在的长按定时器
            clearTimeout(holdTimer);
    
            // 设置一个定时器,如果0.6秒后鼠标仍未松开,则显示光标
            holdTimer = setTimeout(function() {
                // console.log("Hold duration exceeded threshold - showing caret.");
                document.body.classList.remove(HIDE_CARET_CLASS);
                // 此时鼠标仍然是按下的,所以光标应该已经出现并开始闪烁
                // 如果需要,可以在这里强制刷新光标状态,但通常浏览器会自动处理
            }, HOLD_DURATION_THRESHOLD_MS);
    
        }, true); // 使用捕获阶段
    
        document.addEventListener('mouseup', function(event) {
            if (event.button !== 0 || !editorTarget) { // 确保有对应的 editorTarget
                return;
            }
    
            // 清除长按显示光标的定时器,因为鼠标已经松开了
            clearTimeout(holdTimer);
            holdTimer = null;
    
            if (mouseDownTimestamp === 0) { // 如果没有有效的 mousedown 事件记录
                return;
            }
    
            const mouseUpTimestamp = Date.now();
            const pressDuration = mouseUpTimestamp - mouseDownTimestamp;
            // console.log("Mouseup at", mouseUpTimestamp, "Duration:", pressDuration);
    
            if (pressDuration <= HOLD_DURATION_THRESHOLD_MS) {
                // console.log("Press duration within threshold - hiding caret.");
                document.body.classList.add(HIDE_CARET_CLASS);
            } else {
                // 如果按住时间超过了阈值,在mousedown的定时器里已经处理了显示光标的逻辑
                // 或者如果定时器没来得及触发(例如,按住0.7秒松开),这里也确保光标是显示的
                // console.log("Press duration exceeded threshold (mouseup) - ensuring caret is shown.");
                document.body.classList.remove(HIDE_CARET_CLASS);
            }
    
            mouseDownTimestamp = 0; // 重置时间戳,为下一次操作做准备
            editorTarget = null; // 清理目标
    
        }, true); // 使用捕获阶段
    
        console.log("光标按住时长控制脚本已初始化 (阈值: " + HOLD_DURATION_THRESHOLD_MS + "ms)。");
    
    })();
    

    换了个思路,当鼠标按住超过 400 毫秒,显示光标,只是单击就隐藏

    看到闪烁就难受的强迫症患者终于得到治疗

    道爷我成了,我成啦

    1 回复
  • 查看全部回帖

推荐标签 标签

  • Mac

    Mac 是苹果公司自 1984 年起以“Macintosh”开始开发的个人消费型计算机,如:iMac、Mac mini、Macbook Air、Macbook Pro、Macbook、Mac Pro 等计算机。

    168 引用 • 598 回帖
  • Python

    Python 是一种面向对象、直译式电脑编程语言,具有近二十年的发展历史,成熟且稳定。它包含了一组完善而且容易理解的标准库,能够轻松完成很多常见的任务。它的语法简捷和清晰,尽量使用无异义的英语单词,与其它大多数程序设计语言使用大括号不一样,它使用缩进来定义语句块。

    561 引用 • 677 回帖
  • 外包

    有空闲时间是接外包好呢还是学习好呢?

    26 引用 • 234 回帖 • 2 关注
  • ActiveMQ

    ActiveMQ 是 Apache 旗下的一款开源消息总线系统,它完整实现了 JMS 规范,是一个企业级的消息中间件。

    19 引用 • 13 回帖 • 706 关注
  • Outlook
    1 引用 • 5 回帖 • 1 关注
  • 强迫症

    强迫症(OCD)属于焦虑障碍的一种类型,是一组以强迫思维和强迫行为为主要临床表现的神经精神疾病,其特点为有意识的强迫和反强迫并存,一些毫无意义、甚至违背自己意愿的想法或冲动反反复复侵入患者的日常生活。

    15 引用 • 161 回帖 • 1 关注
  • TGIF

    Thank God It's Friday! 感谢老天,总算到星期五啦!

    293 引用 • 4496 回帖 • 688 关注
  • OpenResty

    OpenResty 是一个基于 NGINX 与 Lua 的高性能 Web 平台,其内部集成了大量精良的 Lua 库、第三方模块以及大多数的依赖项。用于方便地搭建能够处理超高并发、扩展性极高的动态 Web 应用、Web 服务和动态网关。

    17 引用 • 51 关注
  • jsDelivr

    jsDelivr 是一个开源的 CDN 服务,可为 npm 包、GitHub 仓库提供免费、快速并且可靠的全球 CDN 加速服务。

    5 引用 • 31 回帖 • 120 关注
  • 游戏

    沉迷游戏伤身,强撸灰飞烟灭。

    188 引用 • 833 回帖 • 2 关注
  • Facebook

    Facebook 是一个联系朋友的社交工具。大家可以通过它和朋友、同事、同学以及周围的人保持互动交流,分享无限上传的图片,发布链接和视频,更可以增进对朋友的了解。

    4 引用 • 15 回帖 • 444 关注
  • Log4j

    Log4j 是 Apache 开源的一款使用广泛的 Java 日志组件。

    20 引用 • 18 回帖 • 60 关注
  • SSL

    SSL(Secure Sockets Layer 安全套接层),及其继任者传输层安全(Transport Layer Security,TLS)是为网络通信提供安全及数据完整性的一种安全协议。TLS 与 SSL 在传输层对网络连接进行加密。

    70 引用 • 193 回帖 • 404 关注
  • WordPress

    WordPress 是一个使用 PHP 语言开发的博客平台,用户可以在支持 PHP 和 MySQL 数据库的服务器上架设自己的博客。也可以把 WordPress 当作一个内容管理系统(CMS)来使用。WordPress 是一个免费的开源项目,在 GNU 通用公共许可证(GPLv2)下授权发布。

    46 引用 • 114 回帖 • 139 关注
  • Linux

    Linux 是一套免费使用和自由传播的类 Unix 操作系统,是一个基于 POSIX 和 Unix 的多用户、多任务、支持多线程和多 CPU 的操作系统。它能运行主要的 Unix 工具软件、应用程序和网络协议,并支持 32 位和 64 位硬件。Linux 继承了 Unix 以网络为核心的设计思想,是一个性能稳定的多用户网络操作系统。

    960 引用 • 946 回帖
  • Unity

    Unity 是由 Unity Technologies 开发的一个让开发者可以轻松创建诸如 2D、3D 多平台的综合型游戏开发工具,是一个全面整合的专业游戏引擎。

    27 引用 • 7 回帖 • 93 关注
  • Office

    Office 现已更名为 Microsoft 365. Microsoft 365 将高级 Office 应用(如 Word、Excel 和 PowerPoint)与 1 TB 的 OneDrive 云存储空间、高级安全性等结合在一起,可帮助你在任何设备上完成操作。

    6 引用 • 35 回帖
  • 小薇

    小薇是一个用 Java 写的 QQ 聊天机器人 Web 服务,可以用于社群互动。

    由于 Smart QQ 从 2019 年 1 月 1 日起停止服务,所以该项目也已经停止维护了!

    35 引用 • 468 回帖 • 768 关注
  • Shell

    Shell 脚本与 Windows/Dos 下的批处理相似,也就是用各类命令预先放入到一个文件中,方便一次性执行的一个程序文件,主要是方便管理员进行设置或者管理用的。但是它比 Windows 下的批处理更强大,比用其他编程程序编辑的程序效率更高,因为它使用了 Linux/Unix 下的命令。

    126 引用 • 83 回帖
  • Bug

    Bug 本意是指臭虫、缺陷、损坏、犯贫、窃听器、小虫等。现在人们把在程序中一些缺陷或问题统称为 bug(漏洞)。

    76 引用 • 1746 回帖 • 10 关注
  • 生活

    生活是指人类生存过程中的各项活动的总和,范畴较广,一般指为幸福的意义而存在。生活实际上是对人生的一种诠释。生活包括人类在社会中与自己息息相关的日常活动和心理影射。

    230 引用 • 1432 回帖
  • MySQL

    MySQL 是一个关系型数据库管理系统,由瑞典 MySQL AB 公司开发,目前属于 Oracle 公司。MySQL 是最流行的关系型数据库管理系统之一。

    695 引用 • 538 回帖 • 2 关注
  • Solo

    Solo 是一款小而美的开源博客系统,专为程序员设计。Solo 有着非常活跃的社区,可将文章作为帖子推送到社区,来自社区的回帖将作为博客评论进行联动(具体细节请浏览 B3log 构思 - 分布式社区网络)。

    这是一种全新的网络社区体验,让热爱记录和分享的你不再感到孤单!

    1449 引用 • 10092 回帖 • 488 关注
  • Jenkins

    Jenkins 是一套开源的持续集成工具。它提供了非常丰富的插件,让构建、部署、自动化集成项目变得简单易用。

    54 引用 • 37 回帖
  • Sandbox

    如果帖子标签含有 Sandbox ,则该帖子会被视为“测试帖”,主要用于测试社区功能,排查 bug 等,该标签下内容不定期进行清理。

    466 引用 • 1241 回帖 • 611 关注
  • 千千插件

    千千块(自定义块 css 和 js)
    可以用 ai 提示词来无限创作思源笔记

    32 引用 • 69 回帖
  • JetBrains

    JetBrains 是一家捷克的软件开发公司,该公司位于捷克的布拉格,并在俄国的圣彼得堡及美国麻州波士顿都设有办公室,该公司最为人所熟知的产品是 Java 编程语言开发撰写时所用的集成开发环境:IntelliJ IDEA

    18 引用 • 54 回帖