樱桃树下的约定

2025年2月20日

摘要：

最近需求出现周维度选择范围，常用的element不支持周类型下面是写了一个dome供大家参考组件库用到moment 处理时间 element【popover】语言vue2 <el-popover placement="bottom" width="650" @show="popoverShow 阅读全文

posted @ 2025-02-20 18:12 樱桃树下的约定阅读(6) 评论(0) 推荐(0) 编辑

2024年11月12日

在一个横向滚动的容器里面，使高亮的子级容器保持一直在可视范围内

摘要： const scrollContainer = document.querySelector('.head-box'); // 父级容器 const activeItem = document.querySelector('.head-title-one'); // 子级容器 const conta 阅读全文

posted @ 2024-11-12 14:49 樱桃树下的约定阅读(8) 评论(0) 推荐(0) 编辑

2024年3月11日

CSS鼠标样式（cursor）

摘要：一、CSS cursor 基本语法 cursor属性是什么：指鼠标指针放在一个元素边界范围内时所呈现的光标形状，它包括问号，小手等形状。使用时可以在任何你想要添加的标签里，插入style="cursor : 某属性值" ，也可以在CSS样式中添加。比如：pointer，小手形状help，帮助形状。阅读全文

posted @ 2024-03-11 10:00 樱桃树下的约定阅读(2149) 评论(0) 推荐(0) 编辑

2024年1月18日

浏览器插件系统提示

摘要： chrome.notifications.create({ type: "basic", title: "贴身助理提醒", message: '美好的一天又开始了，呼吸清新，拥抱阳光；微笑吧，快乐心情，开心一天。早上好，愿你有个好心情！记得打卡', iconUrl: '图片链接', eventTi 阅读全文

posted @ 2024-01-18 14:17 樱桃树下的约定阅读(13) 评论(0) 推荐(0) 编辑

2023年11月16日

js获取抖音弹幕

摘要：使用JS 注入注入方式是以浏览器插件 function dom() { // 创建一个MutationObserver实例 let mutationObserver = new MutationObserver(function(mutationsList, observer) { for(va 阅读全文

posted @ 2023-11-16 14:49 樱桃树下的约定阅读(362) 评论(0) 推荐(0) 编辑

2023年10月4日

图像放大镜🔍

摘要： <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> * {box-sizing: border-box;} .img-zoom-con 阅读全文

posted @ 2023-10-04 09:57 樱桃树下的约定阅读(6) 评论(0) 推荐(0) 编辑

图片放大镜

摘要： <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> * {box-sizing: border-box;} .img-magnifie 阅读全文

posted @ 2023-10-04 09:55 樱桃树下的约定阅读(9) 评论(0) 推荐(0) 编辑

2023年10月3日

HTML Canvas 画布

摘要： HTML <canvas>画布元素用于通过脚本（通常是JavaScript）动态绘制图形。 <canvas> 画布元素只是图形的容器。您必须使用脚本来实际绘制图形。 <canvas>有几种用于绘制路径、框、圆、文本和添加图像的方法。绘制canvas <!DOCTYPE html> <html la 阅读全文

posted @ 2023-10-03 20:55 樱桃树下的约定阅读(164) 评论(0) 推荐(0) 编辑

SVG标签

摘要： SVG 有一些预定义的形状元素矩形 <rect> 圆形 <circle> 椭圆 <ellipse> 线 <line> 折线 <polyline> 多边形 <polygon> 路径 <path> 矩形 - <rect> <svg width="400" height="180"> <rect x=" 阅读全文

posted @ 2023-10-03 14:43 樱桃树下的约定阅读(94) 评论(0) 推荐(0) 编辑

2023年9月30日

纯css实现Tooltip提醒

摘要： <!DOCTYPE html> <html> <style> .tooltip { position: relative; display: inline-block; border-bottom: 1px dotted black; } .tooltip .tooltiptext { visibi 阅读全文

posted @ 2023-09-30 21:39 樱桃树下的约定阅读(146) 评论(0) 推荐(0) 编辑