Image Lazy Loading (Detect when an image content is fully loaded))

Need help
1

Hi,

I would like to ask how I can implement lazy loading for images.
For example, I have a page that allows users to upload images using a Multiple File Uploader. After an image is saved to the database, I assign its URL to an Image element on the screen. However, there is a noticeable delay from when the image appears blank to when it is fully displayed.

How can I detect when the image has fully loaded in Bubble? I’ve found similar issues discussed in this forum, but I haven’t seen a solution yet. :slightly_smiling_face:

2

Bubble uploader sucks, i highly recommend using Better Uploader [UPDATED 2024] ☁ to avoid junk and unecessary calls. Plus you can upload to your browser first, then send to your database (to avoid junk if your user upload twice or some)

also it gives you more control over things such as upload progress so you can add a loading icon or someting when loading progress is < 100 and loading progress > 1

1 Like
3

Thank you for the recommendation, but it does not address my issue because I want to detect the loading status of the image element, not the upload status of the file uploader

4

This topic was automatically closed after 70 days. New replies are no longer allowed.