文章标签

所以您想要一个自动播放循环的无声视频？在流行的俗语中，这正是“GIF”一词的含义。这个词一直沿用至今，但图像格式本身却古老且过时。例如，Twitter……

<picture> 元素有一个技巧，它可以在不同的情况下显示不同的图像格式。如果您只对出于性能考虑的格式感兴趣，也许您可以这样做

<picture<source srcset="img/waterfall.avif" type="image/avif"<source srcset="img/waterfall.webp" 

Steve Faulkner 有一个巧妙的想法这里。您可以显示一个（动画）GIF，并在其顶部叠加一个暂停/播放按钮——实际上是一个<details>/<summary>元素。切换时，内部的（非动画）JPG 会覆盖……

前几天，Cassie Evans 在推特上发布了一个非常巧妙的技巧，我以前从未见过：使用 SVG 对一个 GIF 叠加到另一个 GIF 上进行蒙版。效果非常棒，特别是如果您碰巧抓取了一个彩色 GIF 并……

您是否看到了使用<picture></picture>元素结合<source media=""/>根据prefers-reduced-motion媒体查询提供动画图像（或不提供）的巧妙技巧？

在我们时事通讯中分享了这一点之后，我们收到了一些有趣的……

Safari 11.1 发布了一个奇怪但非常有用的功能：能够在<img />标签中使用视频源。其理念是它与 GIF 执行相同的任务（静音、自动播放、重复），但性能提升巨大。提升幅度有多大？“20 倍”……

我敢打赌您一定见过。一个占据整个浏览器窗口的视频背景。上面有文本（因此称为“背景”），这是一种有趣的视觉效果，您并非每天都能看到。您没有经常看到它的最大原因是……

Ire Aderinokun 描述了一个我们可能都曾经遇到过的令人沮丧的问题

最近，我发现一些 GIF 较多的文章加载速度会变得非常慢。原因在于每一帧

这是一个非常重要的新闻：今天早些时候，WebKit 团队宣布 iOS 10 现在将支持带有 `autoplay` 属性的静音 `<video>` 元素，这对性能来说是一个重大突破。Jer Noble 对此更新进行了更详细的描述：……