JS工具合集

悬浮扫码分享按钮 share.min.js

网页右侧悬浮分享按钮，点击弹出当前页面二维码（自动嵌入 favicon），手机扫码即可访问；可拖拽贴边、自适应明暗主题。

<script src="https://liuli.xx.kg/js/share.min.js"></script>

零依赖、无需初始化配置，引入后自动在页面右侧生成悬浮按钮。

登录注册 UI 组件 auth-widget.min.js

纯前端 UI，不绑定后端。一行引入即拥有登录/注册/邮箱验证码弹窗，支持悬浮或固定、自定义主题、明暗自适应。查看接口契约与教程 →

<script>
  window.AuthWidgetConfig = { apiBase: '/api/auth' };
</script>
<script src="https://liuli.xx.kg/js/auth-widget.min.js"></script>

必须配置 apiBase 指向你自己的后端（接口契约见教程页）。零依赖、自动渲染悬浮按钮。

打赏/赞助按钮 donate-widget.min.js

博客一键加打赏弹窗（支付宝/微信收款码 + 打赏记录），支持自定义样式、暗色自适应。后端是独立 Cloudflare Worker + KV。三步接入教程 → · 在线配置工具 →

<script src="https://liuli.xx.kg/js/donate-widget.min.js"
        data-kv-api-url="https://你的 worker.workers.dev"></script>

需要先部署配套 Worker（见教程页）。收款码在在线配置工具里上传。

阅读进度条 progress.js 未实现

页面顶部随滚动实时显示阅读进度，细条样式，自动适配明暗主题，长文/博客必备。

<script src="https://liuli.xx.kg/js/progress.js"></script>

零依赖，引入后自动在页面顶部生成进度条。

返回顶部按钮 backtop.js 未实现

滚动超过一屏后右下角浮现回到顶部按钮，点击平滑滚动回顶部，支持移动端触屏。

<script src="https://liuli.xx.kg/js/backtop.js"></script>

按钮自动出现/隐藏，无需任何配置。

一键复制文本 copytext.js 未实现

给任意元素加上 data-copy 属性，点击即复制其内容并弹出轻提示，适合链接、邀请码、代码片段。

<script src="https://liuli.xx.kg/js/copytext.js"></script>
<button data-copy="要复制的内容">点我复制</button>

支持带 data-copy 属性的任意元素，点击即复制。

全局页面水印 watermark.js 未实现

整页平铺斜向水印，监听 DOM 变化防止被删除，适合内部系统、文档站防泄露截图。

<script src="https://liuli.xx.kg/js/watermark.js"
        data-text="© 琉璃"></script>

通过 data-text 自定义水印文字。

图片懒加载 lazyload.js 未实现

使用 IntersectionObserver，图片进入视口才加载，带模糊占位，长图页/相册页提速明显。

<script src="https://liuli.xx.kg/js/lazyload.js"></script>
<img data-src="真实图地址" alt="">

将 img 的 src 换成 data-src 即可。