2024年08月23日 by 张 鑫旭 阅读 12818 次, 今日 1 次

CSS滚动动画比我预想的要强多了,项目中又有很多JavaScript代码可以淘汰了。
阅读全文…
标签: animation, animation-range, animation-timeline, CSS动画, overscroll-behavior, scroll-timeline, timeline-scope, view-timeline, 动画, 滚动
发布在 CSS相关 | 8 条评论 »
2024年08月10日 by 张 鑫旭 阅读 12374 次, 今日 1 次

View Transitions API可以让页面元素在无需设置具体定位属性值的情况下实现各种各样的动画效果,是个很强很有用的新特性。
阅读全文…
标签: animation, API, CSS动画, pagereveal, pageswap, transition, View Transitions API, 动画, 动画效果
发布在 CSS相关, Web综合 | 5 条评论 »
2024年07月29日 by 张 鑫旭 阅读 9475 次, 今日 1 次

本文通过案例演示如何使用开源JS库实现音频淡入淡出、原生JS又该实现,以及如何从底层对音频进行淡入淡出转换,都是少见的技术分享。
阅读全文…
标签: audio, AudioBuffer, fade, GainNodes, howler, wavesurfer
发布在 JS实例 | 一条评论 »
2024年07月23日 by 张 鑫旭 阅读 13155 次, 今日 1 次

盼星星,盼月亮,我的第5本书《HTML并不简单》已经正式上架了,这里讲讲为什么会想到写一本关于HTML的书籍,介绍下本书的内容结构,签字版购买等信息,希望可以得到大家的正版支持。
阅读全文…
标签: CSS世界, CSS新世界, html, HTML5, HTML并不简单
发布在 HTML相关 | 12 条评论 »
2024年07月18日 by 张 鑫旭 阅读 11554 次, 今日 1 次

随着Firefox 131也支持了CSS Custom Highlight API,至此,所有现代浏览器下都可以实现无标签的文本内容高亮效果了。
阅读全文…
标签: ::highlight(), ::marker, API, createRange, HighlightRegistry, range, text-decoration, text-fill-color, 高亮代码
发布在 CSS相关, JS API | 11 条评论 »
2024年07月15日 by 张 鑫旭 阅读 9664 次, 今日 1 次
CSS calc()计算函数又新增了infinity,NaN,pi等关键字,都来了解下是干嘛用的吧。
阅读全文…
标签: @property, animation, border-radius, calc, hwb(), infinite, z-index, 关键字
发布在 CSS相关 | 6 条评论 »
2024年07月4日 by 张 鑫旭 阅读 10743 次, 今日 1 次

列举了我目前所知的N多种纯CSS判断是不是Safari和iOS Safari浏览器的方法,希望可以对你的工作有所帮助。
阅读全文…
标签: ::marker, @supports, cross-fade, image-rendering, Safari, selector, text-size-adjust, user-select
发布在 CSS相关 | 一条评论 »
2024年06月30日 by 张 鑫旭 阅读 13420 次, 今日 1 次

现在,CSS已经有能力让元素display:none元素显示与隐藏的时候有transition动画效果了,分别靠@starting-style规则和transition-behavior属性,什么,这些你都不认识?那还不进来看看究竟是什么新特性。
阅读全文…
标签: @starting-style, CSS嵌套, display, opacity, transition, transition-behavior, 淡入淡出
发布在 CSS相关 | 4 条评论 »
2024年06月27日 by 张 鑫旭 阅读 12918 次, 今日 1 次

CSS锚点定位应该是2024年最期待的CSS新特性了,断断续续两周才写完,今天必须要带大家长长见识。
阅读全文…
标签: @position-try, absolute, anchor-size(), API, inset-area, popover, popovertarget, position-try-options, position-visibility, powerFloat, visibility, 锚点, 锚点定位
发布在 CSS相关 | 11 条评论 »
2024年06月11日 by 张 鑫旭 阅读 10516 次, 今日 1 次

最近尝试在Dialog对话框组件中大肆使用顶层特性,以便减少z-index这类层级的判断,结果发现事情并没有预想的那样顺利,顶层特性也是有隐患的,好在有低成本的解决方法。
阅读全文…
标签: ::backdrop, dialog, requestFullscreen, showModal, showPopover, Top Layer, z-index, 全屏, 层级, 弹框, 提示, 锚点定位
发布在 Web综合 | 3 条评论 »