Home/ Questions/Q 1045195
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-16T15:56:51+00:00

any technique that can be used to place on image-holder while waiting for image

  • 0

any technique that can be used to place on image-holder while waiting for image to load. a typical way of doing is placing dummy image while waiting for real image to load.

my image code like below

<div id="realimage" style="background-image: real_image.jpg"/>
  1. any nice way to put as image holder without putting dummy image? using pure css without javascript possible?
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can use the data URI scheme as the source of the dummy image. It will load with the HTML and will not require an additional request.

    So, in your CSS you could do this (embedding a red dot):

    .realimage {background: url('data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD/
//+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4U
g9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC')}

    This is not supported on IE 6/7 and in IE 8 there is a 32k limit on the size of the image.

    • 0