New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. Weβll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Color placeholder β¨ #241
Color placeholder β¨ #241
Conversation
Cool feature! |
This actually would be pretty useful feature! Suggestion: It would be great to use |
@AlexandrHoroshih sure, great idea. Done. |
@ApoorvSaxena friendly ping π» |
README.md
Outdated
Sometimes image loading takes a long time. For this case, you can add a placeholder color: | ||
|
||
```html | ||
<img class="lozad" data-placeholder="red" data-src="image.png" /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
use data-placeholder-background
instead of just data-placeholder
README.md
Outdated
@@ -202,6 +202,16 @@ const coolImage = document.querySelector('.image-to-load-first') | |||
observer.triggerLoad(coolImage); | |||
``` | |||
|
|||
### Large image improvment | |||
|
|||
Sometimes image loading takes a long time. For this case, you can add a placeholder color: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you can add a placeholder background
README.md
Outdated
<img class="lozad" data-placeholder="red" data-src="image.png" /> | ||
``` | ||
|
||
Lozad set the background of `img` element and users will see the fallback. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Set a placeholder background color of img
element and users will see the fallback till the image loads.
@igorkamyshev will be great to have adjoining test cases accompanied with PR |
@igorkamyshev looking forward to merge this PR soon π |
@ApoorvSaxena hi, thanks for answer. Sorry for long delay. Now I fix all issues. Please, review it again and give me your feedback. |
Hello! It is a great library, thanks for it. We use it on our site, and I really love it.
We have one corner-case and want to new feature for handle it. Some of our images really big and loading takes a lot of time. Now, we manually set the background for any large image, and users see the placeholder-color for fallback.
I suggest to add this feature to lozad. π§βπ»
Please, review my idea and PR and give me feedback.
I attach demo page with this feature and reeeeeally slow internet imitation.