Skip to content

Commit d0dc5ba

Browse files
Add examples to tweak effects transition
1 parent c506589 commit d0dc5ba

File tree

1 file changed

+5
-0
lines changed

1 file changed

+5
-0
lines changed

README.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -97,6 +97,10 @@ const MyImage = ({ image }) => (
9797
<LazyLoadImage
9898
alt={image.alt}
9999
effect="blur"
100+
wrapperProps={{
101+
// If you need to, you can tweak the effect transition using the wrapper style.
102+
style: {transitionDelay: "1s"},
103+
}}
100104
src={image.src} />
101105
);
102106
```
@@ -115,6 +119,7 @@ The current available effects are:
115119

116120
![Screenshot of the opacity effect](https://user-images.githubusercontent.com/3616980/37790755-b48a704a-2e07-11e8-91c3-fcd43a91e7b1.gif)
117121

122+
All the effects have a transition duration of 0.3 seconds by default, without transition delay and the default transition timing function. All those values can be modified overriding the wrapper style as shown in the code example above.
118123

119124
## `LazyLoadComponent` usage
120125

0 commit comments

Comments
 (0)