SORU
13 AĞUSTOS 2011, CUMARTESİ


Nasıl bir öğe üzerinde birden fazla CSS geçişler var?

Oldukça basit bir soru ama CSS geçiş özelliği çok iyi belgelerine bulamıyorum. Burada CSS parçacığı:

    .nav a
{
    text-transform:uppercase;
    text-decoration:none;
    color:#d3d3d3;
    line-height:1.5 em;
    font-size:.8em;
    display:block;
    text-align:center;
    text-shadow: 0 -1.5em 0 rgba(255, 255, 255, 0.15);
    -webkit-transition: color .2s linear;
    -moz-transition: color .2s linear;
    -o-transition: color .2s linear;
    transition: color .2s linear;
    -webkit-transition: text-shadow .2s linear;
    -moz-transition: text-shadow .2s linear;
    -o-transition: text-shadow .2s linear;
    transition: text-shadow .2s linear;
}

.nav a:hover
{
    color:#F7931E;
    text-shadow: 0 1.5em 0 rgba(247, 147, 30, 0.15);
}

Gördüğünüz gibi, geçiş özelliklerini birbirleri üzerine. Bu haliyle, metin-gölge, ama bu renk değil animasyon. Hepsi nasıl aynı anda hem animasyon alabilirim? Herhangi bir cevap için teşekkürler.

CEVAP
13 AĞUSTOS 2011, CUMARTESİ


Geçiş özellikleri virgül geçişleri destekleyen tüm tarayıcılarda ayrılmış

.nav a {
  -webkit-transition: color .2s, text-shadow .2s;
  /* And so on... */
}

Kolay varsayılan, bunu belirtmek zorunda değilsin. Eğer gerçekten doğrusal istiyorsanız, bunu belirtmeniz gerekir, yani -webkit-transition: color .2s linear, text-shadow .2s linear;

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • CareyHolzman

    CareyHolzman

    24 Ocak 2008
  • glowpinkstah

    glowpinkstah

    16 Mayıs 2006
  • nemoking of kinges

    nemoking of

    4 EYLÜL 2009