全部文章
共 1299 篇文章
前端实现文本对比，并高亮显示差异！
你有没有想过，常见的代码差异对比是如何都实现的呢？其实这里面涉及到非常复杂的文本对比算法，本文就来看看如何通过现有工具库 jsdiff + diff2html 实现文本对比，并高亮显示差异！ 文本对比 文本对比可以借助 jsdiff 来实现， 是一个 JavaScript 库，用于实现文本差异比较。这个库提供了多种方法来计算和展示两个文本之间的差异，可以用于多种文本差异比较的场景，比如版本控制、文档比较、代码编辑器中的变更高亮等。 js...
手把手教你实现一个中间开屏前言
效果预览 效果如下所示。 HTML部分 首先看到 部分，相关代码如下。 这里包含了一个导航条和两个弹出窗口。 是主导航条的部分。包含了两个链接，分别链接到页面中的不同部分。 和 这两个链接标签（ ）作为导航链接，包含了类名 ，当这些链接被点击时会弹出相关的窗口。 和 这两个部分分别代表了两个弹出的窗口内容。每一个窗口内容块中包含了一个返回的链接（ ）和相应类别的动物表情。 综上所述，这里构建了一个包含导航条和两个弹出窗口的结构，点击不同...
「绝无仅有」CSS打造吸睛的文本与图片无限滚动动画CSS创建文本和图片无限滚动动画效
本文将详细介绍如何使用 和 创建 文本与图片的无限滚动动画 效果。网页内容包含两个部分，一个是 标签组 滚动，另一个是 图片组 滚动，其中动画的效果主要表现为标签和图片一直横向的水平滚动，并且元素会无缝衔接从而实现无限循环，并且首尾两端有渐变蒙层效果，以造成出现和消失的过渡🎢。 HTML 结构 首先， 代码部分包含了5个 元素，这个数量取决于你网页有几个无限滚动区域。每个scroll元素都放了两个 (d1和d2)用于创建滚动容器，其中...
CSS实现胶囊、半圆、90°扇形、4等份圆、吃豆人、对话框、爱心
四个盒子组合实现 一个盒子实现 伪元素实现 三盒子实现
如何在MacOS中管理多个Java版本
在这篇指南中，我们将完成使用 jEnv 命令行工具来管理MacOS系统中的三个JDK版本（Java8、Java11和Java17），大致流程为： 1. 使用MacOS的包管理工具Homebrew安装JDK环境变量管理工具jEnv 2. 使用Homebrewan安装多个JDK版本 3. 将多个Java版本的路径加入jEnv 4. 通过jEnv命令设置全局、项目和shell的Java版本 所有涉及的工具清单如下： Homebrew ，Hom...
nginx使用小记
厚积薄发，静水流深，今天介绍nginx的一些使用 基本配置文件 hosts文件配置域名解析 服务器已经安装了nginx, 并且监听80端口: 如果在服务器的hosts文件中配置了域名, 那么请求网络资源时, 首先会去hosts文件中查找是否有该域名的对应IP, 如果有, 直接请求该路径, 如果没有, 再去请求公共的DNS查询IP 例如, 在服务器的hosts文件中追加该配置: 然后使用 curl tcwwjdr/wwjfiles/ip....
开始学习PWA
答： 诞生于2015年左右的 可以将 web app 包装成 app 的一种方案（理论上不是一种新技术），PWA 可以将 Web 和 App 各自的优势融合在一起：渐进式、可响应、可离线、实现类似 App 的交互、即时更新、安全、可以被搜索引擎检索、可推送、可安装、可链接。 以MDN zh 来说： 就会在桌面上添加一个和原生应用一模一样的web app。 渐进式 适用于选用任何浏览器的所有用户，因为它是以渐进式增强作为核心宗旨来开发的。...
全面横评 6 大前端视频播放器
前言 最近，我在负责公司的音视频开发，使用的技术栈是 Vue3，技术方案采用的是基于第三方库二次封装播放器组件，来实现公司的业务定制需求。 市面上有很多第三方视频库，在最开始进行技术选型的时候，我也花了很多时间。 现在初步把我们公司的音视频组件开发完成了，我对视频第三方库的技术选型进行一个总结分享，希望能帮助到正在进行音视频开发的你。 这次技术选型一共会对比 6 个第三方库： xgplayer 、 video.js 、 ckplayer...
canvas实现画板及定制画笔
IP属地: 江西 2018.12.13 15:24:56字数 224阅读 2,775 本期的小需求: 在页面中实现一个能进行绘画的画板 能实现画笔颜色、粗细、撤回等功能 开发环境 Vue + elementUI 采坑记录 画笔与鼠标错位 （恶心很久） 画笔切换颜色 粗细，原来绘画的线条也改变了 图片跨域等等..... 动手 1.生成或选中canvas对象 2.生成绘画画布环境 ps: canvas 画板绘制api 3.ca...