WishMeLz

生活其实很有趣

分类 HTML 下的文章

随机渐变背景

<style> html, body { margin: 0; } body:after { content: 'click to update'; font-size: 0.8em; color: rgba(0, 0, 0, 0.3); position: fixed; width: 100%; bott...

ANSI 字体在前端展示 Jenkins日志

最近在做运维平台的开发,前端需要显示Jenkins的日志在前端,其中的ANSI字体就是如下示例。192.168.134.39:服务启动,端口检测,等待第3秒 192.168.134.39:服务启动,端口检测,等待第6秒 192.168.134.39:服务启动,端口检测,等待第9秒 192.168.134.39:服务启动,端口检测,等待第12秒 192.168.134.39:服务启动,端口检测,等待第15秒 192.168.134.39:服务启动,端口...

获取视频某一秒的截图

const handleGetVideoThumb = async function (url, options = {}) { if (typeof url !== "string") { console.error("URL must be a string"); return; } // 默认参数 const ...

网络剪切板

网络剪切板、在线编辑文档,多端同步Githubhttps://github.com/pereorga/minimalist-web-notepad示例https://note.ms/https://notecho.in/https://netcut.cn/ 带密码

文字高亮

const regex = new RegExp(searchContent, "gi"); return text.replace(regex,'<span style="color:#286CFB;">$&</span>');

ElementUi table合并

merageArr: any = [] // 每个列应该合并的rowspan index为列的序号 其value为需要合并的数值 merageIndex = 0 merge(){ // 避免筛选合并时出现错行 this.dataList = this.dataList.sort((a,b)=> a.rId-b.rId) // 遍历数组 通过一个key判断是否与上一项相同 // 结果类似于:[3,0,0,2,0] 第一个合并3行,剩下的两个为0...

移动端滑动

按下:touchstart 移动:touchmove 松开:touchend判断左右滑动: 按下记录X轴位置, 划动的过程中判断clientX大于还是小于即可判断左右滑动. 在滑动的过程中持续记录clientX的位置

IOS封装的H5移动端页面底部小黑条

ios封装的web端应用, 滚动到底部后还能继续朝下滚动,出现空白通过监听 touchmove,让需要滑动的地方滑动,不需要滑动的地方禁止滑动。App.vue页面 created() { document.body.addEventListener( "touchmove", (e) => { if (e._isScroller) return; e.preventDefault(); }, { passive: false, }...

移动端input输入时页面放大

<meta content="yes" name="apple-mobile-web-app-capable"> <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">

保存图片文件,下载图片

function downloadIamge(imgsrc, name) { //下载图片地址和图片名 let image = new Image(); // 解决跨域 Canvas 污染问题 image.setAttribute("crossOrigin", "anonymous"); image.onload = function () { let canvas = document.createElement("canvas"); ...

静态页面实时刷新browser-sync

npm install -g browser-sync--files 路径是相对于运行该命令的项目(目录) browser-sync start --server --files "*" browser-sync start --server --files "css/*.css, *.html"

HTML表格

border-collapse:collapse; 合并间距