画图神器Excalidraw:设置弹窗超链接,让交互更优雅!

你是否在使用画图工具时遇到过这样的困扰:为图形添加超链接后,点击总是跳转到新页面,打断了当前的浏览体验?特别是全屏演示时,这种页面跳转显得格外突兀。

Excalidraw 这个开源免费的画图工具,其实隐藏着一个非常实用的功能------弹窗超链接!今天就教大家如何实现这个效果(文汇百川专供)。

效果对比

普通超链接:点击"刘备",直接跳转到新页面

弹窗超链接:点击"关羽",在当前页面弹窗打开

弹窗打开的优点是:不破坏原有布局,保持演示的连贯性,特别适合全屏展示场景!

实现步骤

第一步:准备链接地址

以人员信息为例,在demo演示环境的人脉库中建立了刘、关、张、诸四个人的档案:

  1. 进入人脉库(点击开始 → 人脉库)
  2. 找到对应人员档案
  3. 右键选择"在新窗口打开"
  4. 拷贝地址栏中的链接

第二步:创建Excalidraw图表

  1. 打开文件库(点击开始 → 文件库)
  2. 新建Excalidraw文件,或编辑现有文件
  3. 添加人物图片(可通过百度搜索截图获取)
  4. 将图片粘贴到画布中

第三步:设置弹窗超链接

关键步骤来了!

  1. 右键点击"刘备"图片
  2. 选择"编辑链接"
  3. 粘贴刚才拷贝的链接
  4. 在链接末尾添加"#window"
  5. 点击保存(Ctrl+S)

第四步:验证效果

刷新页面,现在点击刘备的链接,就会以弹窗方式打开了!

按照同样的方法,为关羽、张飞、诸葛亮设置即可。

上述演示可以参考文汇百川官方demo环境,上述文件的地址为:https://demo.finalos.cn/160

相关推荐
qiaochuanbiao9 天前
在浏览器上使用“windows”(WebOS)
webos·文汇百川·文件库·人脉库·个性化设置
qiaochuanbiao11 天前
告别传统PPT!用reveal.js在文汇百川webOS上打造酷炫动态演示
ppt·webos·文汇百川·revealjs
qiaochuanbiao12 天前
宁波教师巧用3D技术,打造互动几何课堂:动态观察正方体组合,让空间想象触手可及
3d·信息可视化·webos·文汇百川
努力进修1 个月前
用 Excalidraw+cpolar 做会议协作,像素级还原实体白板体验
cpolar·1024程序员节·excalidraw
qiaochuanbiao1 个月前
在webos中,在桌面上添加应用
webos·web桌面·超级个体·文汇百川·文汇百川os
SuperHeroWu79 个月前
【HarmonyOS Next】拒绝权限二次申请授权处理
华为·harmonyos·授权·设置·弹框·二次申请权限·拒绝权限
lggirls1 年前
用docker快速安装电子白板Excalidraw绘制流程图
excalidraw·电子白板画图·docker更换源·docker容器自启动·本地web画绘制流程图
engchina1 年前
本地部署 excalidraw
excalidraw
巽星石1 年前
在VSCode中使用Excalidraw
vscode·svg·excalidraw