Home/ Questions/Q 7841395
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-02T16:05:26+00:00

I have a database with images that i need to load on-the-fly per user’s

  • 0

I have a database with images that i need to load on-the-fly per user’s request. The images would go as background images of separate s in an encompassing div container… something like image scroller.

The database is currently a local database but this is not my issue.

the issue is that the database may not have all the images that i have requested…and i may get one or more images that are non-existent… and since things are asynchronous on the database front and the loading image front as well, i am not sure how to go about replacing a non-existent image with a standard placeholder image. I cannot do it on the fly in a loop since that executes way before loading even happens.
I tried using .Load and .error, but i am not sure how i can do that on a background image.

Is there a standard and simple way to deal with this.. preferably without plugins since i have many as is…

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    It seems i could not get away from having to create another DOM elem. Here is what i am now using:

    <div style="background:url(providerSrc)">
<img
     style="display:none" 
       src="providerSrc"
   onerror="this.parentNode.style.backgroundImage='url(fallbackSrc)'"  
   />
</div>

    This is taken from: http://www.daveoncode.com/2010/08/20/image-background-fallback-img-tag-error-handlers/

    If you know of ‘better’ solution please reply

    • 0