Philter.js - Perpustakaan Perubahan Imej Percuma Menggunakan Penapis CSS
Instagram secara meluas dikenali sebagai rangkaian foto yang paling popular. Ia mengendalikan lebih daripada 52 juta gambar sehari dan kebanyakannya termasuk penapis yang mengubah imej dengan cepat.
Ini juga mungkin menggunakan penapis CSS yang memohon terus dalam pelayar. Ciri-ciri penapis tersuai ini mempunyai sokongan luas di banyak penyemak imbas dan mereka kelihatan hebat.
Dengan Plugin JavaScript Philter, anda boleh membuat skala proses ini untuk menjimatkan masa dan memindahkan kod anda ke dalam HTML kesan penapis dinamik.
Dengan menggunakan plugin ini, anda mendapat keuntungan lebih banyak kawalan ke atas imej anda. Dengan cara ini anda boleh memilih penapis yang anda mahu memohon kepada imej individu dan jika penapis tertentu harus berubah berdasarkan kelakuan pengguna seperti melayang.
CSS menyokong peralihan animasi dan Philter membuat proses ini sangat mudah. Anda hanya memuat turun Philter dari laman utama atau dari repo GitHub. Sebaik sahaja ia ditambah ke halaman web anda, anda hanya tambah kod permulaan dan biarkan ia pergi.
Inilah a cuplikan sampel dari repo GitHub:
Secara lalai, anda boleh menyediakan peralihan dan atribut data tambahan yang boleh anda tambahkan dalam HTML. The url parameter menentukan laluan di mana Philter perlu mencari fail SVG tersuai yang digunakan dalam proses penapisan.
Penapis tambahan ini ialah dibungkus dengan perpustakaan, jadi anda tidak perlu mengeditnya sama sekali. Tetapi, anda mungkin menggerakkannya atau meletakkannya ke dalam struktur direktori yang berbeza dari fail semasa anda, jadi tetapan ini mungkin perlu diubah.
Sekarang, anda boleh tambah penapis adat betul ke HTML anda
Inilah a contoh mudah:
Anda boleh mencari senarai penuh semua penapis di GitHub, bersama dengan a panduan persediaan lengkap dan banyak contoh kod lain.
Philter adalah salah satu plugin percuma paling keren di sekeliling dan ia menolak batas CSS moden. Anda juga boleh reka bentuk penapis anda sendiri jika anda bersedia untuk menggali ke dalam pangkalan data dan pengkit di sekelilingnya.
Untuk tempat yang mudah untuk bermula, lawati laman utama Philter dan muat turun salinan. Anda boleh memilikinya & berlari dalam masa yang singkat.
