lio零度

分类

未归档(375)

/ 注册

全部文章（共375篇）

从剪贴板粘贴图像

// 处理 paste 事件 document.addEventListener('paste', function (e) { // 获取剪贴板的数据 const clipboardItems = e.clipboardData.items const items = []...

2021-10-23

0 267

上传前预览图像

我们准备一个上传文件控件，并为预览所选文件准备 img 元素，结构如下： <input type="file" id="fileInput" /> <img id="preview" /> getElemen...

2021-10-23

0 327

打印图像

通过单击浏览器菜单的 Print 选项或按快捷键 Ctrl+P（或 macOS 上的 command+P），可以打印网页。调用 window.print() 方法将提供打印整个页面的相同结果。为了打印图像，我们可以将 img 元素插入到伪 iframe 元素中，并在 iframe 的窗口上调用 ...

2021-10-23

0 270

突出显示缩进

缩进是确保代码能够快速扫描的关键。一个使缩进更具可读性的小插件是 Indent-Rainbow。它为文本前面的缩进着色，在每个步骤上交替使用四种不同的颜色，并标记缩进不是选项卡大小倍数的行。 Indent-Rainbow 虽然错误突出...

2021-10-21

0 305

实时编译 Sass

Live Sass Compiler 使用实时浏览器重新加载功能将 Sass 或 Scss 文件实时编译为 CSS。 Live Sass Compiler 打开 VSCode，按住 Ctrl + P，键入 ext install li...

2021-10-21

0 234

Import Cost

Import Cost 用于显示您在代码编辑器中导入的包的导入大小。该扩展使用 webpack 来检测导入包的大小，效果如下： image.png

2021-10-21

0 269

代码截图

Polacode 允许您直接在 VSCode 中拍摄和编辑代码的屏幕截图。按住 Ctrl + Shift + P 搜索 Polacode，选择您需要截图的代码，然后点击保存按钮： Polacode

2021-10-21

0 229

区分鼠标左键和右键单击

在 mousedown 和 mouseup 事件处理程序让我们知道哪一个鼠标按键点击： ele.addEventListener('mousedown', function (e) { // e.button === 0: 左键被点击 // e.button === 1: 中间按钮...

2021-10-19

0 444

检查是否支持触摸事件

检查当前浏览器是否支持触摸事件： const touchSupported = 'ontouchstart' in window || (window.DocumentTouch && document instanceof DocumentTouch)

2021-10-19

0 198

打开模态时防止身体滚动

打开模态时禁止在 body 元素上滚动 document.body.style.overflow = 'hidden' 关闭模态时允许滚动 document.body.style.removeProperty('overflow')

2021-10-19

0 203