ruk·si
/notes

CSS
Image Loading

Updated at 2013-08-17 02:08

This note contains examples of different cases where you have a hidden image but it might or might not be loaded.

<style>
.image-is-loaded-1 {
    display: none;
    background-image: url('<URL>');
}
.image-is-loaded-2 {
    display: none;
}
.image-not-loaded {
    display: none;
}
.image-not-loaded .the-img {
    background-image: url('<URL>');
}
</style>

<body>

<div class="image-is-loaded-1"></div>

<div class="image-is-loaded-2">
    <img>
</div>

<div class="image-not-loaded">
    <div class="the-img"></div>
</div>

</body>