Perşembe 30 Mart 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. Arayüz
  3. Particles.js ile Güzel Hareketli Parçacıklar Oluşturun
 Particles.js ile Güzel Hareketli Parçacıklar Oluşturun
Arayüz JavaScript

Particles.js ile Güzel Hareketli Parçacıklar Oluşturun

Yazar : Bilal UÇAR 22 Ağustos 2017 0 Comment

Farklı efektler ve spesiyalitelerle dolu milyonlarca ücretsiz animasyon kütüphanesi var. Ancak, yeni Particles.js kütüphanesi, sayfanın tamamında gerçek zamanlı hareket eden hareketli parçacıklar oluşturarak tamamen yeni bir yöne gidiyor.

Bu kullanımı kolay kütüphane, tamamen ücretsizdir ve GitHub‘da açık kaynağa sahiptir. Kesinlikle sitenizin UX‘lerini geliştirmenize yardımcı olmaz, ancak arka plana bazı geçmeli parçacık efektleri eklemenize yardımcı olabilir.

Ana sayfada, kütüphanenin özellikleriyle dolaşabileceğiniz canlı bir interaktif demoyu bulacaksınız. Bu, parçacık boyutunu, hızını, şeklini, rengini, konumunu ayarlamanıza, adlandırmanıza izin verir.

Bu kadar ayrıntılı bir kütüphane olduğu için, çalışması için JavaScript’i iyi anlamış olması gerekir. İşte bu canlı demo çok değerlidir, çünkü herkesin JavaScript’te neler olabileceğini görmek için bu ayarlarla oynamasına izin verilmektedir.

Ve bu grafikleri dışa aktarmanız uygunsa resimleri doğrudan web uygulaması demo sayfasından kaydedebilirsiniz. Ham PNG’yi dışa aktarabilir veya tüm özel ayarlarınızı bir JSON dosyasına kaydedebilir ve daha sonra doğrudan Particles.js komut dosyasına içe aktarabilirsiniz.

Varsayılan olarak, farklı parçacık stillerine sahip birkaç temadan seçim yapabilirsiniz:

  • NASA yıldızları
  • Kabarcıklar
  • Kar
  • Nyan kedi yıldızları
  • Varsayılan geometrik şekiller

Bu varsayılanlarla renkleri, konumları, hızları ve diğer her şeyi hassaslaştırmak için tüm ana ayarları düzenleyebilirsiniz.


Bu kütüphanenin en iyi kısmı doğrudan ana sayfada canlı özelleştirme özelliğidir. Daha fazla ayrıntılara girmek isterseniz JavaScript ve ön kod kodlamayı anlamanız gerekir.

Ancak, bir acemi bile arayüz üzerinden çalışabilir, istedikleri ayarları seçebilir ve her şeyi bir JSON dosyası olarak dışa aktarabilir.

Web üzerinde dinamik parçacıklar yaratmak isteyen herkes için mükemmel bir kütüphane. Daha fazla bilgi edinmek için GitHub repo’yu ziyaret edin ve düşüncelerinizi @ VincentGarreau Twitter’da yaratıcı Vincent Garreauon’la paylaşın.

Bu makalede sitenize parçacık efektleri ekleyebileceğiniz Particles.js kütüphanesinden bahsettik. Siz de düşüncelerinizi yorum yaparak bizlerle paylaşabilirsiniz.

Etiketler: javascript hareketli parçacıklar js hareketli animasyonlar js hareketli efektler particle js kütüphanesi
Önceki Yazı
Sonraki Yazı

Bilal UÇAR (Website)

administrator

Front-end Developer @Webmaster.Kitchen. Front-end developer olarak çalışıyorum. Bu konuda öğrendiklerimi sizlerle paylaşmaya çalışıyorum. Siz de yaptığınız çalışmaları, edindiğiniz bilgileri paylaşabilirsiniz. Yorum alanı ile mutfağa katkıda bulunun.

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.