- 博客(15)
- 收藏
- 关注
RSS订阅原创 xm-select 下拉多选插件
始于 layui 的一个多选解决方案。前身 formSelects, 由于渲染速度慢, 代码冗余, 被放弃了xm-select使用了新的开发方式, 利用preact进行渲染, 大幅度提高渲染速度, 并且可以灵活拓展。
2025-03-11 10:21:41
773
原创 css 鼠标经过多行文字的下划线效果
在网页设计中，客户要求鼠标经过多行文字可以显示下划线，可以通过background-image、background-size等就可以完成。
2025-01-22 16:58:00
151
转载 网站性能优化之【推测性加载】
（Speculative load）是指在用户实际访问相关页面之前，基于对用户下一步最有可能访问的页面的预测，来进行导航操作（如 DNS 获取、获取资源或渲染文档）的行为。这种预测可以由开发者提供（例如他们网站上最受欢迎的目的地列表），或者由浏览器启发式确定（例如基于用户历史记录中的热门网站）。当成功使用时，这些技术可以让页面更快地可用或在某些情况下立即可用，以显著提高性能。本页面总结了可用的推测性加载技术，以及何时可以使用和应该使用这些技术来提高性能。
2025-01-21 14:00:28
31
原创 【前端】关于图片懒加载、预加载
懒加载是一种延迟加载图片的技术，它不会立即加载页面上所有可见或不可见区域内的图片，而是等到用户滚动到接近这些图片时才开始加载。这种方式可以显著减少初始页面加载时间，降低服务器压力，并节省带宽。预加载是指提前加载那些对用户体验至关重要的资源，比如首屏上方的大图、关键CSS文件或字体等。预加载可以让这些资源在浏览器解析HTML文档之前就准备好，从而加快页面的呈现速度。
2025-01-20 16:49:46
362
原创 CSS 数学函数详解与应用实例
CSS 数学函数 允许使用属性值 - 例如 height、 animation-duration或 font-size 元素 - 写为数学表达式。在不使用任何数学的情况下，内置的 CSS 单元 （如 rem、 vw和 % 通常足够灵活，可以设置 HTML 元素的样式以实现特定的用户体验。但是，在某些情况下，使用单个值和单位来表达元素的样式可能会感到受限。在所有这些情况下，我们都需要依靠数学来实现预期的结果。
2025-01-17 11:37:40
1599
原创 【前端】鼠标经过元素跟随效果的兼容PC和移动端详细介绍
鼠标经过元素跟随效果是指当用户将鼠标悬停在某个元素上时，该元素或关联元素会产生特定的变化或动画效果。这种交互方式可以提升用户体验，增加页面的趣味性和互动性。
2025-01-15 09:31:11
1537
原创 【前端】 CSS position粘性定位的用法、兼容问题及解决方案
粘性定位（sticky）是一种根据用户的滚动位置来决定元素定位方式的CSS属性值。它结合了相对定位和固定定位的特点。
2025-01-10 14:26:13
1970
原创 vue 的生命周期及其使用场景
Vue.js 的生命周期是指 Vue 实例从创建到销毁的过程中的各个阶段。理解这些生命周期钩子可以帮助你在正确的时机执行代码，从而更好地控制应用的行为。以下是 Vue 实例的生命周期及其使用场景。
2024-12-26 18:04:53
280
原创 【前端】css 对元素进行剪切成各种形状clip-path
可以直接使用svg文件 对元素进行裁剪。clip-path CSS 属性使用裁剪方式创建元素的可显示区域。区域内的部分显示，区域外的隐藏。也可以使用margin border padding等进行裁剪。可以自定义svg剪切路径。
2024-12-16 13:50:03
284
原创 【前端】css 锚点定位点击之后的滚动行为
锚点滚动将触发滚动行为。请注意，任何其他滚动（例如用户执行的滚动）都不受此属性的影响。在根元素上指定此属性时，它将改为应用于视区。在 body 元素不会 not 传播到视区。如果要整体页面滚动 需要添加到根节点html上。这 scroll-behavior CSS 属性设置导航或 CSSOM 滚动 API 触发滚动时滚动框的行为。
2024-12-14 09:58:06
373
原创 【前端】 如何使图片跟随svg路径运动介绍css （offset）
关于元素在模块上的运动轨迹、介绍关于offset的四个样式offset-path、offset-anchor、offset-distance、offset-rotate
2024-12-13 11:51:10
483
原创 【前端】如何上传获取本地图片途径填充到当前页面img上？ createObjectURL() 和 revokeObjectURL() 的使用。
URL.createObjectURL() 静态方法创建一个用于表示参数中给出的对象的 URL 的字符串。URL 的生命周期与其创建时所在窗口的 document 绑定在一起。新对象 URL 代表指定的 File 对象或 Blob 对象。
2024-12-12 10:51:34
350
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人