yandex

CSS3 @keyframes Nedir? Nasıl Kullanılır ?

Bu içerik 3 sene önce dogukanbatal tarafından yazılmıştır.
Paylaş:

Merhaba bu yazımda CSS3 ile birlikte gelen keyframes özelliği geçişleri sayesinde güzel animasyonlar yapmamızı sağlıyor.

 

Kullanımı

Basit olarak kullanımında 2 kavram mevcut from ve to From başlangıçta, To Bitişte ne olacağını belirtiyor.

Bir diğer Kullanımına aşağıda görmüş olduğunuz gibi yüzdelik şeklindedir.

Bilgi: Animasyonun her tarayıcıda çalışmasını istiyorsak aşağıdaki ekleri eklememiz gerekiyor.

Buraya kadar olan kısım animasyonun nasıl olacağını renk,biçim,vs gibi şeyleri belirtiyor.Şimdide animasyonun tanmlamasını yapalım.

Yukarıda görmüş olduğunuz gibi ornek divini animasyona belirttim.Tarayıcı ön eklerinide bellirttim @keyframes olarak tanımlama yaparken başına -moz ekleyerek firefox içinde uyumlu yapabilirsiniz.

Bu yazım bu kadar @keyframes ile ilgili animasyon örneklerine bir sonraki yazımda anlatacağım.

YORUMLAR ;