Radiobox.css ile Eğlenceli Animasyonlu Radyo Düğmeleri Oluşturma

varsayılan HTML5 radyo düğmeleri oldukça sıkıcı. Yolları var onları özelleştir CSS3 kullanarak, ancak çoğu teknik sadece bakışlara odaklan.

Radiobox.css odaklanır görünüyor ve stil radyo girişlerine özel CSS3 animasyonları ekleme.

Bu kütüphane tamamen ücretsiz ve açık kaynak, İndirmek için GitHub’da kullanılabilir. Bu CSS kütüphanesi ile 12'den fazla farklı animasyon radyo düğmeleri için geçerli.

Özel CSS stilleri olmadan, yine de normal radyo girişleri gibi görünüyorsun. Ancak kullanıcı bir düğmeyi seçmek için tıkladığında çılgın bir animasyon efekti elde et. Görebilirsin canlı örnekler Her bir stili adının yanında gösteren ana Radiobox sayfasında.

Radiobox'ı kurabilirsiniz npm veya bower'dan direkt, hatta dosyaları yerel olarak makinenize indirin. GitHub tüm dosyalarını CDN’de barındırır. bir şey indirmeden oynamak istiyorsan.

İhtiyacınız olan tek dosya radiobox.min.css hangisi gitmeli doğruca belge kafanıza. Oradan, sadece sen basit bir sınıf ekle İstediğiniz animasyona bağlı olarak her radyo düğmesine.

İşte bir kod pasajı için “hoppa” Efekt:

Not “hoppa” animasyon var kendi CSS dosyası denilen boing.min.css. Bu dahil edilmeli Bu etkiyi sayfada kullanmayı planlıyorsanız.

Radiobox'ı indirirken bir demo dizini edinin ile tüm bu etkiler için canlı demolar. Basitçe kodu kopyala / yapıştır uğraşmadan çalışmak için doğrudan sayfanıza.

İçin tam dokümantasyon, kontrol et ana repo ile birlikte canlı demo sitesi. İçerik oluşturucularla iletişim kurmak istiyorsanız, telefondan e-posta gönderebilirsiniz. 720kb web sitesi veya Twitter üzerinden mesaj @ 720kb_.