[Kss-devel] Pre-caching images

Godefroid Chapelle gotcha at bubblenet.be
Mon Feb 9 18:09:47 CET 2009


Lee Joramo wrote:
> I have setup a small KSS that swaps images when you mouse over anchor 
> tags. This works fine on the fast local network, but I need to pre-cache 
> the images some how for it to work  on the live server. How can I get 
> KSS to pre-cache images?
> 
> To see the example I am working on hover over the various Pledge Level 
> links at:
> 
> http://kafm.designkiln.com/#pledgeNow
> 
> 
> Below are a slightly simplified version of my HTML and KSS:
> 
> Many Thanks
> 
> -- 
> Lee Joramo 
> / designKiln.com 
> / 970.261.8426
> 
> 
> 
> HTML:
> 
> <img id="#myImage" src="/images/1.jpg" />
> <a id="link1" href="page1">Page 1</a>
> <a id="link2" href="page1">Page 2</a>
> <a id="link3" href="page1">Page 3</a>
> 
> 
> KSS:
> 
> #link1:mouseover {
>     action-client: setAttribute;
>     setAttribute-kssSelector: "#myImage";
>     setAttribute-name: "src";
>     setAttribute-value: "/images/1.jpg";
> }
> #link2:mouseover {
>     action-client: setAttribute;
>     setAttribute-kssSelector: "#myImage";
>     setAttribute-name: "src";
>     setAttribute-value: "/images/2.jpg";
> }
> #link3:mouseover {
>     action-client: setAttribute;
>     setAttribute-kssSelector: "#myImage";
>     setAttribute-name: "src";
>     setAttribute-value: "/images/3.jpg";
> }
> 
> 
In your case, I would not use a img tag. I would use a div tag, and use 
css to specify size and background image.

That background image would actually be composed of sprites (iow a 
single image that includes your images). KSS would then only specify he 
background offset instead of changing the source.

HTH

-- 
Godefroid Chapelle (aka __gotcha) http://bubblenet.be


More information about the Kss-devel mailing list