CSS Filter Effects 1.0 (Geniş anlatım.)

Héraklés

Héraklés

Özel Üye
27 Haz 2011
6,162
23
Filter Effects 1.0 w3'ün geçtiğimiz ay yayınladığı filtre efektleri beni oldukça heyecanlandırdı! Bu yeni teknolojiyi Google Chrome'ın tasarımcı ve geliştiriciler için özel olarak sunduğu <a href="http://tools.google.com/dlpage/chromesxs">Kanarya</a> tarayıcısında deneyebilirsiniz. Kısa zamanda diğer browserlara da yayılacağını da umuyorum.

Güzel bir örnek...
Ayrıntılara girmeden önce hemen bir örnek gösterelim.
Yukarıdaki orijinal görsele -webkit destekli css'imizi ekliyoruz.

Kod: 
img {
-webkit-filter: brightness(0.1) drop-shadow(7px 7px 20px black) grayscale(1) opacity(1) sepia(1);

İşte inanılmaz, Photoshop'tur bu dedirten sonuç:

Not: Birçok tarayıcı desteklemediğinden snuçları ekran görüntüsü olarak ekleyeceğim, isterseniz deneyebilirsiniz.

<h4>hue-rotate</h4>
Hue/Saturation ayarı ile oynuyoruz. Photoshop'tan tanıdığımız, resimleri siyah/beyaz'a çevirmekten tutun genel olarak renkleriyle ilgili size bir çok güzel imkan sunan tool. Şimdi bunu css ile deviantart görseline uygulayalım.

Kod: 
img {  
   -webkit-filter: hue-rotate(50deg);  
}

İşte sonuç:




<h4>grayscale</h4>
256 çeşit gri ile siyah/beyaz yapalım görselimizi.

Kod: 
  img {  
       -webkit-filter: grayscale(100%);  
    }

İşte Sonu:



Birlikte Kullanım
Bu efektlerin kombinasyonunu birlikte kullanarak daha farklı şeyler yapabilirsiniz.


Sonuç
Kombinasyonlar ve yeni değişkenler sizi Filter Effects 1.0 bekliyor. İyi çalışmalar​
 
Moderatör tarafında düzenlendi:
Cevap yazmak için giriş yap yada kayıt ol.
Üst

Turkhackteam.org internet sitesi 5651 sayılı kanun’un 2. maddesinin 1. fıkrasının m) bendi ile aynı kanunun 5. maddesi kapsamında "Yer Sağlayıcı" konumundadır. İçerikler ön onay olmaksızın tamamen kullanıcılar tarafından oluşturulmaktadır. Turkhackteam.org; Yer sağlayıcı olarak, kullanıcılar tarafından oluşturulan içeriği ya da hukuka aykırı paylaşımı kontrol etmekle ya da araştırmakla yükümlü değildir. Türkhackteam saldırı timleri Türk sitelerine hiçbir zararlı faaliyette bulunmaz. Türkhackteam üyelerinin yaptığı bireysel hack faaliyetlerinden Türkhackteam sorumlu değildir. Sitelerinize Türkhackteam ismi kullanılarak hack faaliyetinde bulunulursa, site-sunucu erişim loglarından bu faaliyeti gerçekleştiren ip adresini tespit edip diğer kanıtlarla birlikte savcılığa suç duyurusunda bulununuz.