Stylehive


Stylehive is using a css style that loads an image placeholder. That way the page doesn’t look blank while the images are loading. Great idea.

img.potential_error_image {
background-image: url('../../images/broken-image.png');
background-repeat: no-repeat;
background-position: 10px 10px;
background-color: white;
}


6 responses to “Stylehive”

  1. From what I’ve seen, background images seem to load only after all inline code and images have loaded.

    So this technique appears to be designed to provide a background for images that have failed to load–the class name implies this too.

    Though after the image is cached, maybe it does work as a loading image background.

  2. From what I’ve seen, background images seem to load only after all inline code and images have loaded.

    So this technique appears to be designed to provide a background for images that have failed to load–the class name implies this too.

    Though after the image is cached, maybe it does work as a loading image background.

  3. yeah, I think once the loading image is cached you may get some effect there. That and the fact that the main images are probably large. There wouldn’t be a huge effect if the main image was small.

  4. Not working very well in Firefox, it automaticlly shows a border around the image until the image starts loading.

    And like say before, the images are loaded before the backgrounds, though placing the ‘broken-image.png’ first thing after the body-tag and hidding it, might do the trick.

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.