Sass/Compass and Sprites: How do I pick random images for a page-specific sprite?

I am using sass/compass and want to take advantage of compass's sprite feature. The project I am on is in a long-standing application where the images are all scattered around in the images folder.

For example, let's say I have two pages, page-a.html and page-b.html which have the following images on each page:

page-a.html:
  /images/foo/bar.png
  /images/elvis-presley.png

page-b.html
  /images/foo/bar.png
  /images/people/david-hasselhoff.png

The compass spriting tutorial suggests that all the images must be in the same directory. Given the above scenario, that is not possible because /images/foo/bar.png is used for both pages (but not necessarily every page of the site). So, in this case I would either have to:

1. duplicate the images/foo/bar.png image and place a copy into a folder specific to each page or
2. symlink the image in each page specific folder to a shared location where the file actually sits

Neither of these options are desirable and would easily prevent me from continuing this sprite optimization attempt.

What I need to know is whether it is possible for compass to create a spr开发者_JAVA百科ite from several images not in the same folder.

You can try

@import "images/**/*.png";

@each $file in bar, elvis-presley, david-hasselhoff {
    .sprite.#{$file} {
        @include flags-sprite($file);
    }
}

if you want the images to change every time the page reloads, then that's impossible with pure css because sass is compiled and not evaluated on every request.

What you are asking is not possible.

Are you planning on replacing the images you mentioned with css sprites? If so, every page would reference the compiled sprite image. The individual image files would no longer be used for any page, so it wouldn't matter where they are in the file system.