2

我使用 Sharp 在我的 Gatsby 网站上延迟加载图像。目前，当图像出现在屏幕上时，它们开始变得模糊并“获得焦点”。

我想在这些图像仍处于“模糊模式”时对它们应用 CSS 样式或过滤器，并在它们完全加载后将其删除。但到目前为止，我在加载之前或之后没有看到类的任何变化。

有没有办法让图像在整个页面加载时拥有一个类，并在图像本身完全加载时丢失该类？或者，有没有办法应用初始样式，然后在完全加载时将其删除？

谢谢 ！

4

1 回答 1

2

就在这里。你可以通过一个placeholderClassName&placeholderStyle道具来gatsby-image喜欢这样：

<Img 
    placeholderClassName="myPlaceHolderClassName"
    placeholderStyle={{transform: `rotate(90deg)`}}
    fluid={edge.node.fluid}
/>
于 2019-06-04T14:14:39.567 回答