Overhang.js - Açılan Bildirim Mesajları için bir jQuery Eklentisi

Ne kadar sinir bozucu varsayılan JS uyarı kutuları? İlkel bir web gelişim döneminden kalan bir kalıntı gibi hissediyorlar.

Bugünlerde yapabiliriz göze çarpmayan bildirim mesajları aynı bilgiyi paylaşan kullanıcı deneyimini bölme. Ve aynen böyle yapabilirsin overhang.js.

Bu ücretsiz jQuery eklentisi olabilir özel bildirim çubukları ekle Bu ekranın üstünden aşağı açılan. Onlar konum CSS ile konumlandırılmış ve JavaScript ile animasyonlu, böylece üstteki sabit bir noktadan düşebilirler sayfa uzunluğundan bağımsız olarak.

Mesajlar oluşturabilirsiniz. belirli bir süre sonra otomatik kapanma, veya başkaları ki kullanıcı girişi gerektir.

Mesajlar yapabilir aktarma başarısı, başarısızlık, hata veya basit bildirimler kullanıcı veya sayfa hakkında bilgi. Mesajlar ayrıca kendi evet / hayır düğmelerine sahip olmak kullanıcılara JavaScript bilgi istemi uyarısı gibi sorular sormak için.

Bu istemleri oluşturmak için bir seçenek bile var bir giriş alanı ile aşağı açılan. Bu bir e-posta kayıt formu için mükemmel olurdu.

Overhang.js jQuery tarafından desteklenen tüm ana tarayıcıları destekler ve ayrıca jQuery UI tarafından desteklenmektedir animasyonlu özellikler için.

JQuery & jQuery UI kütüphanelerinin yanı sıra ayrıca özel bir CSS dosyası ekleyin eklentisi ile. Her zaman yapabilirsin bunu web sitenizin stil sayfasıyla birleştirin HTTP isteklerini azaltmak için.

Yapılan her arama çıkıntı () yöntem olabilir herhangi bir sayıda parametre almak. Bunlar denilen “seçenekleri” ve size her bildirim kutusu üzerinde tam kontrol sağlarlar.

Değiştirebilirsiniz animasyon hızı, süre, hafifletilmesi, ve kutu büyüklüğü / rengi, diğer tasarım özellikleri ile birlikte.

İşte bir örnek pasajı nasıl yapıldığını gösteren onay kutusu oluştur:

 // Bazı onaylar $ ("body"). 

Bunu görebilirsiniz gayet basit ve o çok fazla jQuery kodu gerektirmez.

için bir kopyasını indir Eklentiden, GitHub'taki repoyu ziyaret ederek kaynak dosyalara doğrudan göz atabilirsiniz. Ya da istersen daha canlı örnekler gör Overhang.js web sitesine gidin.