Cuma 26 Mayıs 2023
Hakkında
Yazarlarımız
Reklam
Künye
İletişim
Webmaster.Kitchen – Türkiye'nin Webmaster MutfağıWebmaster.Kitchen – Türkiye'nin Webmaster Mutfağı

Bülten

Sosyal Medya Yasası Kabul Edildi

Binance ‘e Siber Saldırı

Webmaster.Kitchen – Türkiye'nin Webmaster MutfağıWebmaster.Kitchen – Türkiye'nin Webmaster Mutfağı
  • BAŞLARKEN
    • KOD
      • PHP
      • Asp.Net
      • Swift
      • MySQL
      • CMS
  • TASARIM
    • İpuçları
    • Çizim
    • Illustrator
    • Photoshop
    • Trendler
  • ARAYÜZ
    • JavaScript
    • HTML5
    • CSS
    • REACT
  • İPUÇLARI
    • API
    • Güvenlik
    • IDE
    • Framework
    • OS
    • Verimlilik
    • İçerik
      • Dökümantasyon
      • İpuçları
      • Nasıl Oluşturulur?
  • KAYNAKLAR
    • Tasarım
    • Kod
    • İş
  • GİRİŞİM
    • Finans
    • Girişimci
    • Nasıl yapılır?
  • ARAÇLAR
  1. Anasayfa
  2. CSS
  3. CSS için Ücretsiz Filtre Kitaplığı -Philter.js
 CSS için Ücretsiz Filtre Kitaplığı -Philter.js
CSS JavaScript Kod

CSS için Ücretsiz Filtre Kitaplığı -Philter.js

Yazar : Furkan Baycan 5 Temmuz 2017 0 Comment

Bildiğiniz üzere İnstagram, fotoğraf paylaşılan, dünyanın en ünlü medyasıdır. Sadece bu platform üzerinde günde 52 milyon kadar fotoğraf paylaşılmakta. Aynı zamanda filtre sistemini ilk getiren ortamlardan birisidir. Bu işlenen 52 milyon kadar fotoğrafın büyük çoğunluğu filtre özelliğini kullanarak çeşitli filtrelerle paylaşılmaktadır.

Doğrudan tarayıcıya uygulanabilen CSS filtreleri kullanılarak da bu işi yapmak mümkün. Bu özel filtre özellikleri, birçok tarayıcıda geniş bir destek taşıyor ve mükemmel görüntüler sağlıyor. Philter JavaScript eklentisi ile, zamandan tasarruf etmek ve dinamik filtre efektlerini ekleyebilmek için HTML dosyasının içine kodunuzu taşımak bu süreci başlatabilir. Oldukça kolay bir kullanıma sahiptir. Resimlerinizin üzerinde kontrol etkisi sağlayabilirsiniz. Böylelikle, tek tek resimlerinize hangi filtreyi uygulamak istiyorsanız o filtreyi seçebilirsiniz. CSS dediğimiz zaman işin içine animasyon tarafına da hakim olursunuz. Yapmanız gereken buradan kodlarını indirip aşağıda göstereceğimiz şekilde kodunuza entegre etmeniz.

İşte entegrasyon işlemi için kullanabileceğiniz bir snippet;

Varsayılan olarak, HTML’e ekleyebileceğiniz geçişler ve ek veri özellikleri ayarlayabilirsiniz. Url parametresi, Philter’ın filtreleme işleminde kullanılan özel SVG dosyalarına bakması gereken yolu tanımlar. Bu fazladan filtreler kütüphaneyle birlikte paketlenmiştir, dolayısıyla bunları  düzenlemenize hiç gerek yoktur. Ancak, onları hareket ettirebilir veya mevcut dosyanızdan farklı bir dizin yapısına yerleştirebilirsiniz, eğer dizin değiştirirseniz bu ayarların değiştirilmesi gerekebilir. HTML için <img> taglarına doğrudan özel filtreler ekleyebilirsiniz.

Github üzerindeki tüm filtrelerine erişim için buradan erişim sağlayabilirsiniz. Philter, en güzel ücretsiz eklentilerden birisidir ve modern CSS’in sınırlarını gerçekten zorlar. Kod tabanına kendiniz inmek ve yeni bir şeyler üretmek istiyorsanız sizler de kendi filtrelerinizi oluşturabilirsiniz.

Sorularınız olursa yorum yoluyla bize bildirin. Sağ üst tarafta yer alan mail aboneliği kısmından abone olabilir en yeni yayınlarımızdan ilk olarak sizler faydalanabilirsiniz. Herkese iyi çalışmalar.

Etiketler: filtre programı filtreleme css filtreleme javascript fotoğraf filtreleme philter.js site filtre
Önceki Yazı
Sonraki Yazı

Furkan Baycan (Website)

administrator

Güvenlik ve Web Programcılığı alanında çalışıyorum. Bu alanlarda da sizler için mutfakta yazılar yazıyorum. Siz de çok değerli projeleriniz ve yorumlarınızla mutfağa katkıda bulunabilirsiniz.

Yorum Yap Yorumu İptal Et.

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Taze Yazılar
Güncel

Sosyal Medya Yasası Kabul Edildi

14 Ekim 2022
Blockchain

Binance ‘e Siber Saldırı

8 Ekim 2022
Blockchain

Binance ‘den Ücretsiz Eğitim

5 Ekim 2022
Güncel

Japonya için Yenilenen Corolla

4 Ekim 2022
© 2021 Webmaster Kitchen. Tüm Hakları Saklıdır.