Overhang.js – Açılır Bildirim Mesajı
Varsayılan olarak JS uyarıları sizce de çok sıradan değil mi? Bu durumdan sıkılanlar için tavsiyemiz Overhang.js olacaktır. Overhang.js, bir jQuery eklentisidir.
Günümüzde kullanıcı deneyimi oldukça önemli bir noktaya gelmiştir. Kullanıcı deneyimi arttırmanın bir yolu da yapılan işin arayüzünün güzel olmasıdır. Eğer kullanıcıya bildirim göstermek istiyorsanız Overhang.js tam sizin için.
Bu ücretsiz jQuery eklentisi ekranın üst köşesinden aşağı doğru açılır. Bu bildirim çubuğunu CSS vasıtasıyla konumlandırabilir ve JS ile animasyonlu çalışmasını sağlayabilirsiniz. Bu sayede bildirim ekranın üstünde durabilir.
Belirli bir süre sonra otomatik kapanma yapan veya kullanıcı girişi gerektiren diğer iletiler oluşturabilirsiniz.
Mesajlar başarı, başarısızlık, hata veya basit bildirimleri kullanıcı veya sayfa hakkında bilgi aktarabilir.
Bir girdi alanıyla açılan komut istemleri oluşturmak için bile bir seçenek var. Bu, bir e-posta tercih formu için mükemmel olabilir.
Overhang.js, jQuery tarafından desteklenen tüm önemli tarayıcıları destekler ve ayrıca animasyon özellikleri için jQuery UI tarafından desteklenmektedir.
JQuery ve jQuery UI kitaplıklarının yanı sıra, eklentiyle birlikte özel bir CSS dosyası da eklemeniz gerekir. HTTP isteklerini azaltmak için bunu her zaman web sitenizin stil sayfasıyla birleştirebilirsiniz.
Overhang () yöntemine yapılan her çağrı, herhangi bir sayıda parametreyi alabilir. Bunlara “seçenekler” denir ve size her bildirim kutusu üzerinde tam kontrol imkânı verirler.
Animasyon hızını, süresini, hareket rahatlığını ve kutu boyutunu, rengini diğer tasarım özelliklerini değiştirebilirsiniz.
Onay kutusunun nasıl oluşturulacağını gösteren bir örnek:
Gördüğünüz gibi kodlar basit ve profesyonel olarak jQuery bilmeyi gerektirmez.
Eklentinin bir kopyasını indirmek için, kaynak dosyalara doğrudan göz atabileceğiniz GitHub’daki repo‘yu ziyaret edebilirsiniz. Ya da, daha canlı örnekler görmek istiyorsanız, Overhang.js web sitesine gidin.
Bu makalede bildirim çubuğu gibi kullanımlarda işe yarayacak Overhang.js ‘ten bahsettik. Bu konu hakkındaki düşüncelerinizi yorum yaparak bizlerle paylaşabilirsiniz.
