仿钉钉官网滚动效果
发表于|更新于
|浏览量:
恭维含有一种毒剂，使最坚强的人也不免昏昏陶醉。——大仲马
今天在bilibili刷到个视频
https://www.bilibili.com/video/BV12z4y1s7nE/
发现实现了钉钉官网效果
非常的炫酷，仓库源码：
https://gitee.com/vary-space/hello-world/tree/12z4y1s7nE
相关推荐
2022-09-29
relation-graph
青年人如果有青年人的精神，这精神就是乐观——茅盾 这是一个Vue关系图谱组件，可以展示如组织机构图谱、股权架构图谱、集团关系图谱等知识图谱，可提供多种图谱布局，包括树状布局、中心布局、力学布局自动布局等。 git仓库：https://github.com/seeksdream/relation-graph 文档地址：http://relation-graph.com/#/docs/start 在线体验：http://relation-graph.com/#/demo/layout-center 甚至包含在线配置工具 十分强大
2024-02-13
js实现出拳蓄力发射效果
贤妻和健康是一个男子最宝贵的财富。——斯珀吉翁 分享一个蓄力出拳的特效 这个效果放到了codepen里 123456789101112131415161718<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>蓄力发射拳头</title><link rel="stylesheet" href="style.css"></head><body><div id="rocket-container"> <div id="rocket">✊</div>...
2023-04-19
slidev
君子先择而后交，小人先交而后择。——王通 分享一个为开发者打造的演示文稿工具：https://cn.sli.dev/ Slidev (slide + dev, /slʌɪdɪv/) 是基于 Web 的幻灯片制作和演示工具。它旨在让开发者专注在 Markdown 中编写内容，同时拥有支持 HTML 和 Vue 组件的能力，并且能够呈现像素级完美的布局，还在你的演讲稿中内置了互动的演示样例。 它使用了功能丰富的 markdown 文件来生成精美的幻灯片，具有即时重载的体验。它还拥有很多内置的集成功能，如实时编码、导出 PDF、演讲录制等。由于 Slidev 是由 web 驱动的，因此你可以使用它进行任何操作 —— 具有无限的可能性。 你可以在 为什么选 Slidev 部分了解更多关于本项目的设计初衷。
2022-01-10
oss视频截封面
所谓世人，不就是你吗？——太宰治《人间失格》 今天上传视频后发现没有上传封面… 后来发现阿里云oss支持直接截取封面 文档地址： https://help.aliyun.com/document_detail/64555.html 也就是说，如果之前的视频URL为： 1/img/oss/picGo/rabbit.mp4 那么我们加上参数 1/img/oss/picGo/rabbit.mp4?x-oss-process=video/snapshot,t_10000,f_jpg 就会变成一张图片 参数说明操作分类：video 操作名称：snapshot 参数 描述 取值范围 t 指定截图时间。 [0,视频时长]单位：ms w 指定截图宽度，如果指定为0，则自动计算。 [0,视频宽度]单位：像素（px） h 指定截图高度，如果指定为0，则自动计算；如果w和h都为0，则输出为原视频宽高。 [0,视频高度]单位：像素（px） m 指定截图模式，不指定则为默认模式，根据时间精确截图。如果指定为fast，则截取该时间点之前的最近的一个关键帧。 枚举值：fa...
2025-01-30
readability
我当然不会试图摘月，我要月亮奔我而来。——奥黛丽赫本 https://github.com/mozilla/readability 最近发现了一款由 Mozilla 开发的开源工具 Readability.js，这是一个专注于网页内容提取的库，它能够快速解析网页中的正文内容，过滤掉广告、导航栏等干扰信息。Firefox 的“阅读模式”正是基于 Readability.js 实现的。这款工具对于需要优化网页阅读体验、自动提取文章内容的开发者来说非常实用。 什么是 Readability.jsReadability.js 是 Mozilla 为了提升用户网页阅读体验而开发的一个工具，能够将网页上的主要内容提取出来并生成清爽的 HTML 片段。它非常适合集成到浏览器扩展、阅读器应用、内容聚合平台等项目中。 安装和使用1. 安装在 Node.js 环境中可以通过 npm 直接安装： 1npm install @mozilla/readability 2. 基本使用要使用 Readability.js 提取网页内容，只需传入一个 DOM 文档对象并调用 parse() 方法： 1...
2024-12-18
ARIA16
兴趣是最好的老师，其次是耻辱——胖子邓 ARIA16技术：使用aria-label增强Web可访问性 在现代Web开发中，可访问性（Accessibility）是提升用户体验的关键因素之一。尤其对于视障用户来说，屏幕阅读器依赖准确的页面结构和标签描述来解释内容。ARIA16是一种有效的技术，使用aria-label属性为无可见文本的元素提供描述性标签，从而增强Web的可访问性。 什么是ARIA16？ARIA16是W3C推荐的一项技术，旨在通过aria-label属性为交互式元素提供可访问性支持。aria-label允许开发者为没有可见文本的元素定义可读的描述信息，供屏幕阅读器使用。 使用场景 图标按钮：为只有图标的按钮添加描述性标签。 装饰性元素：为装饰性但可交互的元素提供语义化说明。 复杂控件：为动态生成或没有内嵌文本的控件提供可读内容。 如何使用ARIA16？实现ARIA16非常简单，只需在相关元素上添加aria-label属性并提供适当的描述文本。 示例代码以下是一个使用aria-label的图标按钮示例： 123456<button aria-label=&q...