KültürlüPenguen adlı üyeden alıntı

Bir sprite resim oluşturuyoruz.Mesela devamını oku için.Biri mavi bir yeşil olsun.
.degisenbuton{
background:url(more.png) no-repeat -0 -0;
width:100px;
height:100px;
-webkit-transition:all 1.5s;
-o-transition:all 1.5s;
-moz-transition:all 1.5s;
}
.degisenbuton:hover{
background:url(more.png) no-repeat -100px -0;
width:100px;
hegiht:100px;
-webkit-transition:all 1.5s;
-o-transition:all 1.5s;
-moz-transition:all 1.5s;
}

Mantık aynı.Bir sprite resimle veya normal resimle hover olayında bg'leri değiştiriyoruz.Bunları da transition ile yavaş değişmesini sağlıyoruz.
Umarım anlamışsındır.

Not:CSS'leri salladım.