To further optimize Garland performance, consider using CSS Image rollovers.
see: http://www.designmeme.com/articles/cssrollovers/ for an example of what I mean.

This will only load 1 image for the entire theme, and then different mouseover sections will use different co-ordinates of the image.

Put all of the following files into one big PNG:
*bg-bar-white.png
*bg-content-right.png
*bg-navigation-item.png
*body.png
*menu-expanded.gif
*bg-bar.png
*bg-content.png
*bg-navigation.png
*gradient-inner.png
*menu-leaf.gif
*bg-content-left.png
*bg-navigation-item-hover.png
*bg-tab.png
*menu-collapsed.gif

Could this work?

Thanks

Comments

Crell’s picture

Crell commented
Status: Active » Closed (won't fix)

Positioned background images are all well and good for rollovers, but using them for all images on the page is asking for trouble. The technique doesn't always work right, especially in IE. It also makes updating images much harder, because you have to recalculate all of your image positions every time you change an image. So no, I don't think it would work to go that far with it.

Steven’s picture

Steven commented
Title: To further optimize Garland performance, consider using CSS Image rollovers » Garland: Use CSS sprites for roll-overs.
Status: Closed (won't fix) » Active

I decided against CSS sprites for the rollovers, because they would be harder to generate programmatically (we'd have to assemble slices together again). This is something for 6.0.

Using them for static background images is a lot of work, especially in a layered theme like Garland. It is not worth the trouble IMO.

jacauc’s picture

jacauc commented

Thats why i marked the issue for 6.x dev

jacauc’s picture

jacauc commented

Could we consider doing this for the one thing that annoys me and some people testing my devel site the most?

That thing is the little downward arrow above the primary links. When hovering over a primary link, it is annoying to wait for the new image to load.

Just a thought... Really not a trainsmash, but would be nice.
Thanks again!

Stefan Nagtegaal’s picture

Stefan Nagtegaal commented
Title: Garland: Use CSS sprites for roll-overs. » Garland: Combine bg-navigation-item.png and bg-navigation-item-hover.png for faster hovering
Version: 6.x-dev » 7.x-dev
Assigned: Unassigned » Stefan Nagtegaal

I'm working on Garland/Minelli again, so updating the title and assigning myself..

Jeff Burnz’s picture

Jeff Burnz commented
Version: 7.x-dev » 8.x-dev

Looks like this never happened - bumping off to D8.

amateescu’s picture

amateescu commented
Status: Active » Closed (won't fix)

The Garland theme has been removed from D8: #911054: Remove Garland from Core