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

  • BuzzFeedVideo

    BuzzFeedVide

    10 AĞUSTOS 2011
  • kylediablo

    kylediablo

    8 Ocak 2007
  • Visual Life

    Visual Life

    3 Temmuz 2006

İLGİLİ SORU / CEVAPLAR