Css 3 getirdiği yenilikler ve imkanlar ile gerçekten web de kullanılan arayüzün duruşunu değiştirmeye başladı. Ancak hala tarayıcı ya da başka sebeplerden dolayı css3 kullanamayanlar istemeyenler mevcut. Bunun için de jquery de bir çok kütüphane oluşturma işine girildi ancak çoğu ya da yeterince kapsamlı değil ya da çok başarılı olmuyor.
Jquery Transit i yapan arkadaşlar cidden uğraşmış, hem geniş hem temiz bir kütüphane ortaya çıkarmışlar. Kullandığım günden beri pek bir sorunla karşılaştım diyemem. Css 3 sevdalısı olan benim gibi biri için bile pek çok noktada daha avantajlı olduğunu gördüm.
Kullanımı ise cidden basit. Jquery de herhangi bir "animation()" olayını çalıştırmaktan pek farklı değil hatta bir çok değişik eylemi tetiklediği için daha kapsamlı ve kolay. Mesela "box" öğesini sağa doğru 90 piksel kaydırmak istiyorsunuz:
$('.box').transition({ x: '90px' });
Başka bir kütüphaneyi kullanmaktan farksız bir şekilde de sitenize veya uygulamanıza ekleyebilirsiniz. Önce Jquery kütüphanesinin kendisini ekleyip sonra jquery transit kütüphanesini ekliyorsunuz.
Kütüphaneyi buradan direk ya da kendi adreslerine giderek indirebilirsiniz.
Örnek olarak:
Yüzde 120 kutuyu büyüt:
$('.box').transition({ scale: 1.2 });
3 boyutlu olarak kutuyu üstten döndür:
$('.box').transition({perspective: '100px',rotateX: '180deg'});
$('.box').transition({ opacity: 0 }, 'slow');
$('.box').transition({ x: 330 }, 500, 'snap');
$('.box').transition({x: 100,duration: 2000,rotate: 30,easing: 'snap'});